サイトの表示速度をアップさせるには、キャッシュ系プラグインを使うことができます。ただ、設定に時間がかかることが多くテーマとの相性が悪い場合は、画面が真っ白になることもあります。
ですので、本来なら使う必要がないのかもしれません。しかし、アクセス数がおおいサイトは、サーバーにかかる負荷を軽減させることができるので、導入したほうが良いのではないかと思います。
今回は、賢威テンプレートで使えるキャッシュ系プラグインWP Fastest Cacheの設定方法について紹介しています。
このページの目次
サイトの速度を測定するツールの紹介
まずはサイトの速度を測定するツールを3つ紹介しますね。サイトの速度を測定してみて下さい。
サイトの表示速度を測定するには「PageSpeed Insight」「GTmetrix」「Website Speed Test」といったツールを利用することができます。
https://developers.google.com/speed/pagespeed/insights/
簡単に確認するなら、Googleが提供しているPageSpeed Insightがおすすめです。また、もっと詳しく測定結果を知るには、GTmetrixやWebsite Speed Testをおすすめします。ただ、こちらで測定すると、結果が出るまで少し時間がかかるかと思います。
また、スコアはURLの入力の仕方で違ってきます。たとえばこのサイトは「https://www.buzzclub.site」ですが、「http://buzzclub.site」と入力したときと「https://buzzclub.site」と入力したとき、それから「https://www.buzzclub.site」と入力したときでは、それぞれスコアが違います。
賢威テンプレートは要注意！W3 Total Cacheを使ったら画面が真っ白になった！
キャッシュ系プラグインには、キャッシュをひとつしか生成できないものと、パソコンとスマホに分けてキャッシュを作成できるものがあります。
サイトを高速化させるには、パソコンとモバイルでキャッシュを別々に作成することが必要になってきます。そこで、おすすめなのが「W3 Total Cache」というキャッシュ系プラグインです。
しかし、賢威テンプレートの場合、このプラグインを導入すると画面が真っ白になります。ですので、賢威テンプレートにはおすすめではありません。
また、キャッシュ系プラグインを設置するときは、バックアップを必ずしてくださいね。他のサイトで機能しているプラグインでも、あなたのサイトで同じように使えるとは限りません。
画面が真っ白になったり、Fatal error (致命的なエラー）が表示されることもあります。これがでると本当にびっくりします。ということで、新しくプラグインを導入するときには、バックアップをとって下さい。
今回は賢威テンプレートでも使用できるキャッシュ系プラグインWP Fastest Cacheの設定について説明します。スマホを使って表示を確認しながら設定してみて下さい。
キャッシュ系プラグインWP Fastest Cacheを設定する手順
WP Fastest Cacheは以下の手順で設定します。
- インストールと有効化
- 表示の日本語化
- 基本の設定
- キャッシュの削除
- キャッシュの有効期限の設定
WP Fastest Cacheのインストールと有効化
まずは管理画面の「プラグイン」から「新規追加」をクリックします。
「キーワード」に「WP Fastest Cache」と入力すると表示されるので「今すぐインストールする」をクリックします。
このプラグインは頻繁に更新されているので、評価が高いです。プラグインは定期的に更新されるものがおすすめです。
「有効化」をクリックします。
管理画面左に「WP Fastest Cache」が表示されたら、有効化されています。
表示の日本語化
「WP Fastest Cache」をクリックします。すると英語の画面が表示されるので、「Language」をクリックして「日本語」を選択し「submit」をクリックします。
これで日本語の画面に切り替わります。基本の設定はこの画面だけで完了することができるので、分かりやすいです。
無料版ですと、使える機能に制限がついていますが、アクセスがそれほど多くないということなら、十分に使えると思います。
基本の設定
ではさっそく、基本の設定をしていきましょう。こちらは設定後の画面です。グレーになっていない所には、すべてチェックを入れていきましょう。ちなみにグレー表示は有料版の設定です。
クリックするとポップアップウィンドウが表示される項目があるので、分かりやすいように説明します。
キャッシュ：
このプラグイン全体の機能を有効にするかどうかを選択します。うまく機能しないときには、ここのチェックを外して下さい。
Preload（プレロード）:
この項目もチェックをいれます。するとこのポップアップウィンドウが表示されますので、全部の項目にチェックをいれて「pages per minutes」は「６」にして下さい。
どういうことかというと1分間に上の6つのページキャッシュを定期的にするという意味です。あらかじめキャッシュを作成しておくことで、サーバーへの負担を軽減することが出来ます。
「Restart After Completed」は、キャッシュが完成したら、また再スタートするということになります。最後に「OK」をクリックします。
ログインユーザー:
ここにチェックを入れることによって、ワードプレスにログインしているユーザーには、キャッシュが適用されなくなります。記事の更新をした場合、キャッシュが有効になっていると編集部分が反映されませんので不便です。
この場合は、編集するたびにキャッシュを削除しなくてはなりません。しかし、ここにチェックを入れておけば、変更した部分の確認がすぐにできます。
モバイル：
ワードプレスのテーマによっては、パソコンとモバイルで表示が異なることがあります。ここをチェックしておくことで、モバイル端末からのアクセスでパソコン表示になるということを防げます。
ただしここを有効にすると、モバイルからアクセスがあったときの負荷を軽減できません。しかし、アクセスがそれほど多くなければ問題はないと思います。
また、有料版にするとモバイルのキャッシュを作成することができます。ですので、アクセス数が増えてきたら考えてみて下さい。パソコンのキャッシュとモバイルのキャッシュを分けて作成できるキャッシュ系プラグインは「W3 Total Cache」です。
このプラグインなら、PC用とモバイル用のキャッシュを無料で作成することが出来ます。ですので、相性の良いテーマをご利用の場合は、W3 Total Cacheをおすすめします。
ただ、賢威テンプレートに限らず、画面が真っ白になったというケースが多いようなので、導入するときは注意が必要です。
新しい投稿：
ここをクリックするとポップアップウィンドウが表示されます。「Clear All Cache」にチェックが入っていると思うので、このままにして下さい。
「OK」をクリックします。
Update Post：
チェックをいれるとポップアップウィンドウが表示されます。記事が更新されたときも取り敢えず全部のキャッシュを削除したほうが良いと思いますので「Clear All Cache」を選択します。
「OK」をクリックします。
HTMLの圧縮：
HTMLファイルを圧縮することで、ダウンロード時間を短縮することができますが、ソースコードが読みにくくなる可能性があります。チェックを入れたときと入れないときの表示速度を測定してみて下さい。変わりがなければ、外しておいても良いと思います。
CSSの圧縮：
ここはチェックを入れます。CSSファイルの余分なスペースや改行を取り除いて、ファイルサイズを小さくすることが出来ます。
CSSの統合：
HTTPリクエストの数が多いと、オーバーヘッドが発生します。オーバーヘッドとは、実際の目的とは関係のない処理のことで、無駄な作業になります。ここはチェックをいれます。
JSの結合：
こちらもオーバーヘッド対策です。ページの上部にJavaScriptファイルが多いと表示速度は遅くなります。そこでJavaScriptファイルをひとつにまとめます。
Gzip圧縮：
サーバー上から転送されるファイルには、「テキスト、HTML、RSS、CSS、JavaScript」などがあります。ここにチェックを入れることで、こういったサイトのソースをサーバー上で圧縮してから転送することができ、転送量を軽減することによって高速化が図れます。
ブラウザキャッシュ：
ブラウザキャッシュとは表示したウェブページのデータを一時的にコンピューターに保存する機能のことです。ブラウザにファイルのデータを読み込ませることで、サーバーから読み込まずにブラウザのキャッシュを表示させることができます。その結果、高速化が図れます。ここはチェックを入れます。
Disable Emojis：
ここにもチェックを入れて、絵文字は無効にして下さい。
では、全部の設定を確認してみて下さい。そして最後に「変更の保存」をクリックします。
「画面の上部に設定が完了しました」と表示されれば、基本の設定は完了です。
キャッシュの削除
では、キャッシュの削除のタブを見ていきましょう。無料版で使える機能は2つあり、作成されたキャッシュを削除したいときに使えます。
「キャッシュの削除」をクリックすれはキャッシュフォルダに入っているすべてのキャッシュを削除することが出来ます。また、「キャッシュと圧縮されたCSS/JavaScriptファイルを削除する」をクリックすることで、すべてのキャッシュと圧縮されたこれらのファイルを同時に削除することが出来ます。
ただ、毎回この画面から削除するのは面倒です。もっと簡単にキャッシュを削除するには、こちらのほうが便利です。WP Fastest Cacheを有効化しておくと管理画面にチーターマークが表示されますね。
ここをクリックすることによって、削除できるので、こちらを使っていきましょう。
キャッシュの有効期限の設定
ここでは、キャッシュの有効期限を指定することが出来ます。この設定をすることでキャッシュが自動的に削除されます。これは便利ですから、さっそく設定していきましょう。
まずは「Add New Rule」をクリックします。
すると、次のようなダイアログが表示されるので、「If REQUEST_URI」を「全て」にしてから、キャッシュを削除する間隔を設定して「Save」をクリックします。
あまり削除する必要がない場合は「一日に一回」または「週」に一度くらいが良いと思います。自動でキャッシュが削除される間隔を設定したら、「Save」をクリックします。
あまりにも間隔が狭いと、サーバーへの負担が大きくなるので、始めはなんどか設定を変更して調整してみて下さい。また「画像の最適化」と「プレミアム」は有料サービスになるのでスキップします。
「除外する」のタブでは、キャッシュしたくないページを登録することができますが、あまり使わないと思います。ですので「CDN」のタブに移ります。CDNとは、HTML、画像、CSS、JavaScriptといったファイルを他のサーバーに置くことで、サーバーの負担を軽減するサービのことです。
ただしこのサービスは、ほとんど有料での提供です。しかし、Cloudflareでは無料で使うことが出来ます。登録と設定方法については、こちらの記事を参考にしてみて下さい。
だた、エックスサーバーを利用することによって、ほとんどのサイトは、CDNサービスの必要がないと思います。というのは、エックスサーバーで一番安いプランでも、1日の転送量の上限は50GBくらいあるからです。
エックスサーバーのX10プランは、月額たったの1000円くらいです。にもかかわらず、1ヶ月にするとおよそ1.5TBものデータを転送してくれるのですから、嬉しいサービスです。
10日間の無料お試し期間がついているので、レンタルサーバーを模索されている方は、参考にしてみて下さい。
最後のタブ、DB(7328)も有料サービスなのでスキップします。これでWP Fastest Cacheの設定は完了です。少しでも高速化されていれば、良いと思います。
