wordpressでサイトの表示速度をあげるためにしたこと
まずは速度をはかってみる
速度をはかるのはこちらから行いました
GTmetrix | Website Speed and Performance Optimization
計測すると、こうすれば早くなるっていう項目が表示されるので、画像関係のところは改善します。（サイズを減らしたり、height・widthを指定したり、元画像のサイズと表示しているサイズが違うのを直したり）、その他の分からないところはプラグインで解決しますので後ほど。
Googleさんの言うことを聞いてみる
ここでGoogleさんから、こうしたらいいよっていうアドバイスを受ける事ができます。
「スクロールせずに見えるコンテンツのレンダリングをブロックしている JavaScript/CSS を排除する」
というのが気になり調べました。
head内に外部Javascript/CSSを読み込ませていると、それを読み込み終わらないとサイトが表示されないためにページ全体の読み込み速度が遅くなってしまうようです。
CSSは仕方ないので、JavaScriptをfooterに移動します。
ソースを確認してみると、wordpressプラグインが読み込むcssが多くありました。
それでリクエスト数が増えているのがよくなさそうだったので、必要なものだけstyle.cssに移動して、CSSを削除することに。
下の記事を参考にfunctions.phpに書き加えました。
プラグインを使う
使ったのは、
・JetPackプラグインのphoton
jetpackという便利機能詰め合わせプラグインをインストールし、その中のphotonを有効化しました。photonというのはざっくり言うと画像を配信専用のサーバーから配信することで表示を早くする機能です。複雑な設定が必要ないのがいいですね。
もともとはCloudflareという無料で使えるCDNを使っていたのですが、photonの方が良いって言う記事を見たので変更しました。速度はあまり変わりませんでしたが・・・
・キャッシュプラグイン
キャッシュプラグインを入れました。不具合を起こす場合もあるようで、注意が必要っぽいです。
キャッシュプラグイン内でMinimize（コードの圧縮）ができるみたいなのでそれも設定しました。
・画像の軽量化プラグイン EWWW Image Optimizer、Imasnity
EWWWの使い方は下の記事を参考に。
EWWW Image Optimizer の設定方法と使い方
それと併用できる、画像アップロード時に圧縮してくれるImsanityというプラグインも入れました。
GTmetrixでAランクに
改善したら、Page InsightsとGTmetrixをチェックして、直せるところは直して・・・ってやっていくと、ランクがAになりました。もっと早くしたいですが、サンプル動画を埋め込んでいる関係もあり、限界はありますね。
