サイトのページ表示速度を上げる

BLOG

 ブログのページ表示速度を測定してみたら大変良くなかった。詳細は下のページ。

 プラグイン「EWWW Image Optimizer」で画像最適化して、サーバー引っ越して(PHP CGIモードからモジュールモードへ)、体感的には速くなったが、PageSpeed Insightsの速度スコアはほとんど上がらなかった。

 モバイルでスコア90以上は到底無理だが、『ウェブに関する主な指標テストに合格していません』という文言が気になるので解消したい。

 サーチコンソールのページ エクスペリエンスの「ウェブに関する主な指標」を見ると不良ばかり。
 LCP(ページの最大のコンテンツ表示までの時間)が4s超えると不良

何とか少しでも

 「レンダリングを妨げるリソースの除外」で表示されていた

  •  https://ajax.googleapis.com/……/jquery.min.js……
  •  https://cdnjs.cloudflare.com/……/jquery-migrate.min.js……

は迂闊にいじれないと思っていたが、次のサイトに従った。

ウェブ屋SATO Cocoon | レンダリングを妨げるリソースの除外の改善(tomohikosato.com/wordpress/1844

 『JavaScriptをフッターで読み込む』。

 WordPressの外観 - テーマエディター(テーマの編集)から、
 (Cocoonの場合、子テーマ Cocoon Childの)テーマのための関数 function.phpに

function is_footer_javascript_enable(){
return true;
}

を追加。

 「レンダリングを妨げるリソースの除外」は表示されなくなった。

 次にWebPなどの「次世代フォーマットでの画像の配信」という項目が目障りだが、
 画像があるから表示速度が遅いという実感があまりないので保留。

 ヘッダー背景画像のみTinyPNG(tinypng.com/)で圧縮しておいた。
 TinyPNGはPNGファイルだけでなくJPEGファイルも圧縮できる。

もう少し何とか

 画像のLazy Load(遅延読み込み)はちらつく感じが慣れないので無効。
 ブラウザキャッシュも追記や修正した後、すぐに反映されないのであまり使いたくない。
 もう打つ手がないと思っていたら、あった。
 Googleアドセンスの自動広告をやめてみた。

 結局、Webフォントも自動広告も断念。いっそのことヘッダー背景画像もやめてしまおうかとも思ったが、面白くない。

 PageSpeed Insightsのスコアは上がっていないが、体感的には速くなったのだっ。

 ※ 追)GoogleアドセンスのLazy Load + 自動広告でスコアが上がった。

 その後、もう一度測定したら
 モバイル 57
 パソコン 79

 モバイルが上がってパソコンが下がった。

 モバイルのFCP 3.4s、LCP 3.5s。

 前回、今回ともにFCP、LCPはOrigin Summaryの値。
 『過去28日間の収集期間について……』とあるから対策したら即反映されるというものではないようだ。

 一方、その下のラボデータはLighthouseというツールで分析された値で、即反映され、スコアはこちらに基づく、とある。

 なお、

  •  CLS Cumulative Layout Shift = 『ビューポート内の視覚要素がどのくらい移動しているか』

という指標は問題なかった。

 ひとまずサーチコンソールの「ウェブに関する主な指標」は不良から改善が必要になった。
 LCP2.5秒超。

 また不良に逆戻りする可能性もあるが、これ以上は再度サーバー引っ越すしかなさそう。(当面行うつもりはないが。)

 GTmetrixのグレードはDからCに上がった。最初のサーバー応答時間 TTFBは1.5s(秒)。

 グレードAは無理っぽい。

 今後はPHPが8へバージョンアップしたので、少し期待。(まだ7のまま使っている。)

関連記事(一部広告)
コロエッグ
タイトルとURLをコピーしました