PageSpeed Insightsで100点満点の神設定を全部公開。
レンタルサーバ、Wordpressテーマの設定、
プラグイン構成など設定項目などを公開します。
使用テーマは「Swell」となります。
現在のPageSpeedの点数
こちらはこのブログのトップページの現在の状況です。
3日間ほどこの状態を維持していますので、安定した100点が取れています。
左側がモバイル、右側がPCとなります。
こちらは記事のページです。
左側がモバイル、右側がPCとなります。
ともに100点が出ている状態です。
時々モバイルが99点になる時がありますが概ね100点となっています。
これ以上は難しいと判断して現状私の中での最高な設定を「神設定」として
記事で備忘録として保存しておきます。
WordPressの環境
WordPressの環境
レンタルサーバー Xserver スタンダードプラン
CPU：AMD EPYC 7543( 2.80GHz ) x 2
メモリ：1024GB
WordPress 6.0.2
テーマ SWELL 2.6.8.3 (Swell子テーマ使用)
PHP 7.4.28
CDN 未使用
プラグインの構成
Akismet Anti-Spam (v.5.0)
Autoptimize (v.3.1.1.1)
Broken Link Checker (v.1.11.18)
Contact Form 7 (v.5.6.3)
EWWW Image Optimizer (v.6.8.0)
Flying Scripts (v.1.2.3)
SEO SIMPLE PACK (v.2.5.1)
WP Multibyte Patch (v.2.9)
WP Revisions Control (v.1.4.3)
WP to Twitter (v.3.6.1)
XML Sitemap & Google News (v.5.3.3)
※ContactForm、WP to Twitter、Broken Link Checkerは必要な場合のみ
となっています。
一般的な構成だと思います。
Xserver レンタルサーバーの設定
XPageSpeed
XPageSpeedは使用していません。
Webフォント
Webフォントも未使用となっています。
WordPressセキュリティ設定
WordPressのセキュリティ項目は全てONにしており国外IPを全て弾いています。
Xアクセラレーター
XアクセラレーターはVer2を使用しています。
サーバーキャッシュ設定
サーバーキャッシュは未使用です。
ブラウザキャッシュ設定
ブラウザキャッシュ設定も未使用となっています。
SWELL テーマの設定項目
高速化 設定
高速化のキャッシュ機能ですが、トップページ以外は全てキャッシュしています。
トップページをキャッシュにすると新たに投稿した記事が新着記事に表示されない場合があり
トップページだけ無効にしています。
キャッシュ期間は32日にしています。
ファイルの読み込み
ファイルの読み込みは2つにチェックを入れています。
遅延読み込み機能
遅延読み込み機能ですが、記事下コンテンツ、フッターを遅延読み込みさせています。
画像のLazyloadはEWWW Image Optimizerのプラグインで行っている為に使用していません。
またスクリプトの遅延読み込みもFlying Scriptで行っている為に使用していません。
ページ遷移高速化
ページ遷移の高速化はPrefetchにしています。
JQueryの読み込み設定
JQueryの読み込み設定は全てチェックしています。
Font Awesomの読み込み
Font Awesomeは読み込まないにしています。
機能停止 SWELL機能
この変はそんなに影響は無いとは思いますが、私の場合はLPやブログパーツなど使わなかったので
機能を停止しています。
機能停止 WordPressの機能
WordPressの機能の方はたしかセルフピンバックだけ停止したと思います。
SWELL 子テーマの追加CSS
子テーマの追加CSSには各種読み込まれるフォントのswapさせるCSSと
ContactFormのreCaptchaのロゴが表示されるのを無効にしています。
また画像の縮小率の関係なのか時々画像の枠に青色の破線が表示されるのを無効にしています。
SWELL 子テーマのfunctions.php
・子テーマのfunctions.phpには、ブロックエディターでスペーサーで高さを
40px、30px、20pxへ変更できるブロックを追加する機能
・ContactForm7が必要なページのみで読み込まれるように設定しております。
WordPressプラグイン Autoptimizeの設定項目
JavaScriptオプション
JavaScriptコードの最適化を有効
連結しないで遅延を有効
CSSオプション
CSSコードを最適化を有効
CSSファイルを連結を有効
インラインのCSSも連結を有効
レンダリングブロックしているCSSを除去を有効
AutoptimizeからCSSを除外は標準設定にしています。
HTMLオプション
HTMLコードを最適化を有効
その他設定項目
こちらは標準のままだと思います。
Autoptimize 画像設定
Autoptimizeでの画像処理は一切使っていません。
追加設定
その他追加設定はそのままの状態です。
Googleフォントを削除にしても良いと思いますが、今後様子を見て削除したいと思います。
WordPressプラグイン Flying Scriptsの設定
Flying Scriptsの設定はjqueryやadsense関連、Analyticsなどを指定しています。
遅延タイムは5秒にしていますが、7秒などにすると広告の表示も遅くなるために5秒にしています。
WordPressプラグイン EWWW Image Optimizerの設定
基本設定
WebP変換やhtaccessは適用済み、画像の最大幅やExif情報の削除
その他にCLS対策などの項目にチェックしています。
ローカル設定
ローカル設定はそのままにしています。
高度な設定
高度な設定ではJPGやWebPの品質を少し落としています。
その他に「リサイズ」「変換」項目は標準のまま使用しています。
あとがき
XServerの新サーバー移行と併せてWordpressのテーマを「SWELL」へと変更して
かなりサーチコンソールのグラフが乱高下しておりました。
安定するまで1か月近くかかり現在の状態になりました。
まだLCPやTBT、FCPなどモバイルでの数値は下げれそうな気もしますが、
PageInsightのスコアを見て調整、設定、スコアを見て設定などしながら
3日間放置したりしてやっとここまで来ました。
神設定と書いていますが、様々な環境でWordPressをご使用されていると思いますので
一概にこれだけをすれば全ての環境で100%になるわけではありませんが、
少なくとも私の環境では現時点で最高の設定になりました。
またこれからも調整していくので現時点で安定している設定を全て
備忘録として記録しようと記事にしてみました。
設定など間違いなど項目があれば教えて頂ければ幸いです。
皆様の環境でのご参考になればと思います。
コメント