Head Cleaner コードを軽量化して表示速度を向上させるプラグイン 設定方法と使い方読み終わるまで 1 分

ワードプレス(WordPress)のブログサイトのページ表示速度の向上が期待できるプラグイン「Head Cleaner」を解説します。

Head Cleanerで実現できること

ブログ・サイトのWoredPressのHTML、CSS、JavaScriptのコードを軽量化してページ表示速度を高速化が期待できるプラグインが「Head Cleaner」です。

「Head Cleaner」と他のページ表示速度を高速化させるプラグインと違う点は、コードを軽量化するのとキャッシュ機能の2つの機能を併せ持っている点です。

• HTML、CSS、JavaScriptのコードを軽量化
• CSSとJavaScriptをキャッシュする

この2つの機能を含んでいるプラグインとは競合を起こして不具合を起こすので、どちらか一方だけを有効化させる必要があります。

Head Cleanerのインストール方法

Head CleanerプラグインをWordPressにインストールする方法を解説します。

WoredPressのダッシュボード(管理者画面)の新規プラグイン追加画面

1. WordPressのダッシュボード(管理者画面)の「プラグイン」をクリックします
2. 「新規追加」をクリックします
3. 検索ボックスに”Head Cleaner”と入力すると下に検索結果が表示されます
4. ”Head Cleaner”の「今すぐインストール」ボタンをクリックします

“Head Cleaner”のインストール完了画面

↑Head Cleanerのインストールが完了すると有効化ボタンが表示されるのでクリックします。

“Head Cleaner”を有効化すると表示される画面

これでHead Cleanerのインストールと有効化が完了しました。

Head Cleanerの使い方

Head Cleanerをインストールして有効化した状態では何も設定されていないため機能していません。当記事の設定項目を参考に設定してください。

設定を変更する前にWoredPress全体のバックアップを取得することをおすすめします。
イチオシのバックアップ用プラグインは「BackWPup」です。
「BackWPup」の使い方と設定方法はこちらの記事を参照してください↓
BackWPup バックアッププラグインの設定方法と使い方

ここからはHead Cleanerの設定方法を解説します。

WoredPressのダッシュボード(管理者画面)の「設定」内の「Head Cleaner」をクリック

↑Head Cleanerの設定画面に入るにはWoredPressのダッシュボード(管理者画面)の「設定」内の「Head Cleaner」をクリックします。

Head Cleaner 設定

Head Cleanerの設定は1つの画面内で完結するのでシンプルです。

Head Cleanerの設定画面(未設定状態)

1. CSSとJavaScriptを、サーバ上にキャッシュするにチェックマークを入れます
2. 更新ボタンを押します。

そうすると、新たな設定項目が表示されます。

Head Cleanerの設定画面(設定状態)

1. 項目にチェックマークを入れます※チェックマークを入れる箇所は下記に詳細記載しています
2. 更新ボタンを押します。

Head Cleanerの効果

Head Cleanerを導入する前と後でどの程度表示速度が向上したのか、効果を測定してみました。

スマホ環境

Head Cleaner導入前に「PageSpeed Insights」で測定したスマホ環境のパフォーマンス

Head Cleaner導入後に「PageSpeed Insights」で測定したスマホ環境のパフォーマンス

Head Cleaner導入後のほうが約10％パフォーマンスが低下しました。

さらにHead Cleaner導入後に画面の表示が崩れる不具合が起きました。

Head Cleanerはブログ・サイトの表示が崩れる不具合が発生する

Head Cleanerを設定後、崩れたブログ・サイトの画面

↑PCのWebブラウザで表示すると最上部にPHPのエラーが表示されています。※赤枠部分

2022年5月時点でHead Cleanerは5年以上も更新されていないため、最新のPHPとWoredPressのバージョンに対応しておらず、ブログ・サイトの表示が崩れます。

まとめ

Head Cleanerはアップデートが5年以上実施されておらず、最新のPHPとWoredPressに対応していないため、まともに使用できません。

なので、Head Cleanerの導入は諦めて、他のコード最適化プラグインやキャッシュプラグインの導入を検討してください。

コード最適化プラグインは「Autoptimize」をおすすめします。
JavaScript非同期/遅延プラグイン「Async JavaScript」と組み合わせると更に効果的です。
設定方法等はこちらの記事を参考にしてください↓
Autoptimize コードを最適化して高速化するプラグイン 設定方法と使い方
Async JavaScript 非同期・延期プラグインの設定方法と使い方

キャッシュ用プラグインは設定が簡単で気軽に導入できる「WP Super Cache」がおすすめです。

「WP Super Cache」の詳しい解説はこちらの記事を参考にしてください↓
WP Super Cache ページ表示速度高速化キャッシュプラグイン 設定方法と使い方