広告

【高速化】WordPressが重い！プラグインを見直すだけで表示速度が4倍に？

2017年10月5日

WordPressが重い！施策3：プラグイン2つを新規導入

12個プラグイン削除したのに無風って...

と迷いに迷った挙句、新規導入したプラグインは以下２つ。

  1. BJ Lazy Load
  2. WP Fastest Cache

運営している他のサイトで導入済みなので、多分効果はあるだろうと。

導入したプラグイン1. BJ Lazy Load

導入プラグイン1は「J Lazy Load」です。

bj-lazy-load

Webページの閲覧部分に応じて、画像を遅らせながら表示させるプラグイン。全ての画像を読み込ませないことでページの表示スピードをUPさせることができます。

基本的には 「プラグイン ＞ 新規追加 ＞BJ Lazy Load ＞今すぐインストール ＞有効化」だけでOK！

直ぐにサイトの表示スピード改善に一役買ってくれます。

しかしLazy Load系のプラグインは画像を遅延表示させる代わりに、Googlebotが画像を認識しなくなってしまう弱さも。

そのためBJ Lazy Load のPHPコードを一部改変してあげる必要があります。

BJ Lazy LoadのPHPコードを改変

「ダッシュボード ＞ プラグイン ＞プラグイン編集」をクリック。

画面右上にある ”編集するプラグインを選択” のプルダウンから「BJ Lazy Load」を選択。

プルダウン下にある ”プラグインファイル” 一覧から 「bj-lazy-load/inc/class-bjll.php」を選択。

編集画面が開くので...

Ctrl+Fで下記コードを検索して、

/* We do not touch the feeds */

直ぐ下のコードを書き換えていきます。

改変前

/* We do not touch the feeds */
if ( is_feed() ) {
return;
}

改変後

/* We do not touch the feeds */
if ( is_feed() || stripos($_SERVER['HTTP_USER_AGENT'], 'Googlebot') ) {
return;
}

GooglebotにBJ Lazy Load内を検索してもらうコードを追記したわけですね。これで画像のクロールエラーを避けることができます＼(^o^)／

BJ Lazy Loadのコードの改変につきましては「CreativeTips [icon name="external-link" class="" unprefixed_class=""]」さんの記事を参考にさせていただきました。

この場を借りて御礼申し上げます。ありがとうございましたm(_ _)m

導入したプラグイン2. WP Fastest Cache

導入プラグイン2は「WP Fastest Cache」です。

wp-fastest-cache.0.8.7.3

言わずと知れた？キャッシュ系プラグインの代表ですね。キャッシュの基本設定がまとまっているので、とても扱いやすいです。

先ずは「プラグイン ＞ 新規追加 ＞WP Fastest Cache ＞今すぐインストール ＞有効化」して下さい。

WP Fastest Cacheの設定

「ダッシュボード ＞ WP Fastest Cache ＞ 設定」画面で下記項目に✔を入力。

このプラグインの適用は下記表示の全てに✔しました。

  • Homepage（トップページを先に生成）
  • Categories（カテゴリページを先に生成）
  • Posta（固定ページを先に生成）
  • Pages（投稿ページを先に生成）
  • Tags（タグを先に生成）
  • Attachments（添付ファイルページを先に生成）

一部引用：https://nelog.jp/wp-fastest-cache

次に「キャッシュの有効期限 ＞ Add New Rule」をクリック。

キャッシュの有効期限を決める画面が表示されるので

  • If REQUEST_URI：全て
  • Then：1日に1回

と設定して「Save」をクリック。

これで一日一回はキャッシュがクリアされる設定になります。

タブ「画像の最適化」は有料Verのみの適用なので割愛します。あと、プレミアムタブも。

キャッシュから除外するページを追加します。タブ「除外する ＞ Add New Rule」をクリック。

キャッシュ除外ページの設定画面が出るので

If REQUEST_URI：Home Page

と設定して「Save」をクリック。

除外するページ画面に「Home Page」が表示されていればOKです。これでホームページはキャッシュクリアから除外されます。

タブ「CDN」の設定は勉強不足のため割愛です。すみません...

タブ「DB」も有料Verで使用出来るようになります。

WP fastest cacheプラグインの設定はひとまずこれで完了。

WP fastest cacheプラグインの設定については寝ログさんの記事[icon name="external-link" class="" unprefixed_class=""]を参照にさせていただきました。

度々とありがとうございますm(__)m

WP fastest cache と BJ Lazy Loadプラグイン設定後、GTmertrixで再々テストを行ってみました。すると...

WP fastest cache ＋ BJ Lazy Loadを設定後に再テストした結果...!

【BEFORE】

【AFTER】

  • Pagespeedスコア：D→A（26％改善）
  • YSlow スコア：E→D（12%改善）
  • 完全にロードされた時間：9.6→8.8S(0.8S改善）

ほぼ全ての項目でサイトの読み込み改善が測れました＼(^o^)／！

PagespeedスコアがD→Aになったのはとても嬉しい限り。タイトルの「表示速度が４倍に」というか、結果的には4ランクアップでしたね...

また新規記事を全然追加していないにも関わらず、改善後はサイト全体のPVも10％ほど増加しました。

裏を返せば10％の人が離脱していたという事実...

ほんっと読み込み遅くてすみませんm(_ _;)m

オススメShow Article Mapで簡単に内部リンクを最適化！

まとめ. WordPressが重い！プラグインを見直すだけで表示速度が4倍に

読み込み速度の改善については沢山の手法が公開されています。

全ての手法がどのサイトにも当てはまるわけではないので、今回は比較的簡単に行えるプラグインの削除・導入で対策してみました。

  • サイト読込速度改善1
    使ってないプラグインを削除！
  • サイト読込速度改善2
    BJ Lazy Loadを導入！
  • サイト読込速度改善3
    WP fastest cacheを導入！

最終的にサイト全体の読み込み速度が向上出来たので、今回の施策は成功かなと。

しかしこのサイトはまだまだ表示が遅いので、今回で終わらず「簡単に出来て効果大な方法」があれば追って公開していきます(^o^)

OYAKUN
結果的には不要なプラグインを見直す良い機会になりました。
簡単解析！
GoogleAnalytics-dashboardforwp-Eyecatch
Google analytics dashboard for wpを設定すれば管理画面でアクセス解析可能に！

Google MAPS APIを設置してアクセス数を地域別に確認しよう！ 初めに「Google MAPS API」は使用 ...

コピペで楽勝
Spreadsheet-sheetgmail-Eyecatch
【コピペで完了】スプレッドシートからメール送信！スクリプトで一発解決！

スプレッドシートからメール送信を実行する ではスプレッドシートからメール送信を実行してみましょう＼(^o^)／ スクリプ ...

< 1 2>

WordPress-showarticlemap-Eyecatch 【最適化】WordPress・内部リンク専用プラグインShow Article Mapがスゴイ

スプレッドシートのプルダウンを連動させよう！同じシートの中で設定する基本編 Spreadsheet-pulldown-rendou-Eyecatch