ITStudyのサイトを高速化してみた

ITStudyサイトはXSERVERを使用しています。テーマは「Cocoon」です。高速化の設定によってどれくらいの効果があるか確認してみました。

まず、Googleが無料で提供している「PageSpeed Insights」というツールを使ってサイトの表示速度を調べます。ウェブページのURLを入力し、「分析」ボタンをクリックするだけで調べることができます。

結果はこちら。87点なので「まあまあの速度」というところですね。できれば90点以上にしたいものです。

XSERVERの高速化設定

XSERVERには高速化設定が4つあります。

  • Xアクセラレータ
  • mod_pagespeed設定
  • サーバーキャッシュ設定
  • ブラウザキャッシュ設定

それぞれの設定はデフォルトのまま使用してきたので高速化できそうなら設定を変更します。Xアクセラレータの設定はVer1が選択されていました。Ver2の方がさらに高速化できるので設定変更します。

mod_pagespeed設定は新規の受け付けが終了していました。
「mod_pagespeed設定」機能の新規設定の受付終了について

サーバーキャッシュ設定はOFFになっていたのでONに変更しました。

ブラウザキャッシュ設定はOFFでしたが、このままOFFにしておきます。ブラウザにキャッシュされると記事を修正してもキャッシュされたファイルを見に行って最新の記事が確認できないことがあるためです。

Cocoonの高速化設定

Cocoonの設定は公式サイトに記載があるのでそちらをご参照下さい。サイトの内容は少しバージョンが古いので項目内容に違いがありますが、設定はできると思います。
https://wp-cocoon.com/site-speed-up/

高速化の効果

高速化の設定後、再度、「PageSpeed Insights」で分析します。結果は以下の通り。効果でていますね。

まとめ

設定変更したのは「Xアクセラレータ」と「サーバーキャッシュ設定」の2つです。画像だと細かい部分がわかりにくいので表でまとめておきます。まだ設定したことがないという方は参考にして下さい。

設定変更前XアクセラレータXアクセラレータ
ServerCache設定
Xアクセラレータ
ServerCache設定
Cocoon設定
First Contentful Paint(FCP)1.4S1.4S1.4S1.4S
初回入力遅延(FID)10ms10ms10ms10ms
First Contentful Paint0.7秒0.6秒0.6秒0.3秒
First Meaningful Paint0.7秒0.6秒0.7秒0.5秒
速度インデックス1.5秒1.2秒1.3秒1.2秒
CPU の初回アイドル2.7秒2.6秒2.2秒1.7秒
インタラクティブになるまでの時間2.8秒2.7秒2.4秒1.7秒
初回入力遅延の最大推定時間140ミリ秒80ミリ秒100ミリ秒100ミリ秒
次世代フォーマットでの画像の配信0.68S0.84S0.64S0.38S
レンダリングを妨げるリソースの除外0.49S0.47S0.47S
総合点87919397

コメント

タイトルとURLをコピーしました