「ブログの表示が遅い…」ブログの表示を高速化するために行ったことリスト
ふと、自分のブログを見たときのことです。
表示が異常に遅い…
最初の表示に20秒くらいかかります。
「これじゃあ、誰も見ないんじゃないの？」
と心配になります。
ただ、この後見ていると自分のブログだけでなく、
いくつかの他のウェブサイトも遅いようです。
どうやら共通点はGoogle Adsenseを利用しているサイトのよう。
ネット上で話題になっていないことから、
「自分の環境だけだろう」と推測しました。
そして、2、3日後に表示速度が正常に戻りました。
「一体何だったんだろう」
今でも理由は分かりません。
いい機会なので、ブログの表示高速化に手を付けることにしました。
いろいろ試してみたので、自分の忘備録も兼ねて書いていきます。
アドセンスの前に文章を表示
ブログの表示が異常に遅い現象により、
Google Adsenseが読み込まれるまで、
ブログ記事の文章が表示されていないことが分かりました。
「Google Adsenseの表示に関係なく、ブログの文章は表示して欲しい」
それを解決してくれたのが、この記事でした。
function.phpを書き換え、javaScriptの非同期を行いました。
なお、function.phpの書き換えはブログが一切表示されなくなる危険性があります。
https://tonarithailand.com/post-358/
必ず、ファイルのバックアップを取り、
すぐにアップロードできる準備をしておきましょう。
javaScriptの非同期により、
Google Adsenseの読み込み中にも、
ブログの文章が表示されるようになりました。
入れて良かったプラグイン
さらにブログの表示を高速化するために、
WordPressのプラグインを入れることにしました。
EWWW Image Optimizer
画像ファイルを圧縮してくれるプラグイン。
- 画像をアップすると自動でファイルサイズを圧縮してくれる
- 過去にアップした画像を検出し、ファイルサイズの圧縮が一括でできる
- 画像圧縮の処理が早い
設定は上の記事を参考にしました。
メタデータ（写真のEXIF情報など）も削除してくれるので便利！
ブログには要らないですからね。
W3 Total Cache
ブログの表示にキャッシュを使うようにしてくれるプラグイン。
これを使うと、今までは詳しい技術者でも困難だったサイトの表示速度の高速化のためのキャッシュやサーバーの設定を容易に行えるようになる。
設定は上の記事を参考にしました。
ぼくの場合は、表示高速化できましたが、
ブログによっては不具合が起こる場合があるそうなので、
導入は慎重に。
一度入れてみたけど、無効化したプラグイン
Lazy Load
ページの表示後に画像を読み込むように変更するプラグイン。
効果が感じられなかったので無効化しました。
WP Super Cache
WordPressで作ったサイトを、表示高速化するプラグイン。
有効化すると、ブログのトップページが変な色に。
不具合も多く報告されているようです。
もちろん、無効化しました。
ブログの表示速度を測定
上記のサイトで、ブログの表示速度を測定しました。
モバイル、パソコン共に50点台でPoorだった表示速度が、
モバイルが68点、パソコンが84点のNeeds Workに改善されました。
実際に見た体感でもずいぶん早くなりました。
Goodには届いていませんが、「修正が必要」の項目はなくなったので、
とりあえずはこのくらいでいいかなと思っています。