まだWordPressのための最高のパフォーマンスプラグインを知らないのですか?ディスカバー Perfmatters

Perfmatters、コンフィギュレーションガイド。

 
Perfmatters、コンフィギュレーションガイド。

もし明日、無人島にプラグインをひとつだけ持っていけると言われたら、おそらくPerfmattersを持っていくでしょうし、ファンクラブがあれば登録して、彼らのコンサートに全部行くでしょう。

2021年1月から使っていますが、最も問題を解決してくれたプラグインの一つであり、読み込み速度を軽くするのに一番、貢献してくれているプラグインだと思います。

エッセンシャル

毎年の更新日が来ても、払わないという可能性を微塵も疑わないツールの一つです。ちなみに、1つのサイトで使う分にはとても経済的です。24.95ドルのみで、次回以降の更新は15%割引となります。 だから2年目以降は、わずか21.21ドルだ。

いくつかの機能については別途レビューしているため、より詳細な分析とセットアップのチュートリアルは保留とさせていただきました。それがこの記事の狙いです。

設定について

Perfmatters、コンフィギュレーションガイド。 1
Perfmatters、コンフィギュレーションガイド。 2

免責事項:言うまでもなく、追加したオンとオフのアイコンは私の設定によるもので、このブログではこれがベストです。だからといって、あなたの環境にとって理想的な1台とは限りません。

シナリオはすべて異なる。それぞれのオプションを勉強して理解し、その挙動を実験して、自分のケースに最適なものを決める必要があります。そのためには、ひとつひとつ試してみて、その結果を評価することに勝るものはありません。

もう一つ注意したいのは、重複したツールはぶつかるということです。 WP Rocketや Litespeedによるサーバーキャッシュプラグインなど、同じ機能を持ち、全く同じことができるプラグインは他にもあるのです。一緒に起動すると、コンフリクトが発生する可能性があります。どれが一番効果的かを見極めて、どちらか一方だけにこだわる必要があります。

一般タブ

一般タブには、最も一般的なツールが含まれています。すべての項目の横には、対応するヘルプへのリンクがあります。臆することなく、挑戦してみてください。すべてがリバーシブルです。スイッチをクリックすると、すべてが元の状態に戻り、ここでは何も起こりません。

Perfmatters、コンフィギュレーションガイド。 1

絵文字を無効にする

2015年のWordPressバージョン4.2では、旧ブラウザ向けに絵文字のサポートがコアに追加されました。

これらはそれほど重くはありませんが(18KB+その他のJS)、ブログのすべてのページでwp-emoji-release.min.jsJavaScriptをロードし、1つのリクエストが常に少なくなるため、これらを無効にすることが可能です。

Perfmatters、コンフィギュレーションガイド。 4

Perfmatters、コンフィギュレーションガイド。 1

ダッシュボードを無効にする

Dashiconsは、バージョン3.8以降、WordPress管理画面の公式アイコンフォントとして採用されています。テンプレートによっては、dashicons.min.cssというCSSを読み込んでフロントエンドで使用するものもあります。しかし、最近のテーマやプラグインの多くは、すでに独自のアイコンやSVGを使用していたり、まったくアイコンがなかったりします。スタイルシートは不要な読み込み時間を増やし、レンダリングも阻害するので、ダッシュコンを使用しないのであれば、無効にしてください。

Perfmatters、コンフィギュレーションガイド。 6

Perfmattersからこれらを無効にしても、これらを使用しているWordPressの管理画面には影響がありません。ログインしていない状態では、フロントエンドのダッシュアイコンのみ削除されます。

Perfmatters、コンフィギュレーションガイド。 2

エンベッドを無効にする

エディタでブログからのリンクを追加すると、WordPressはそれを認識し、そのように表示します(スタイルが変更されていない場合)。

Perfmatters、コンフィギュレーションガイド。 8

エンベッドが気にならない方は、エンベッドを無効にして少し負担を軽くすることができます。プレビュー付きのリンクは、段落間の関連リンクとして使用すると、クリック率が高くなる傾向があることに気づいたので、オフにはしていないのです。

WordPressのバージョン4.4から、エンベデッドまたは埋め込みが可能になりました。欠点は、ロードするためにさらに別のJavaScriptを含めることによって追加される余分なコードが付属していることです:wp-embed.min.js

Perfmatters、コンフィギュレーションガイド。 9

あなたのブログの埋め込みを無効にすると、他のブログがそのプレビューであなたのサイトからのリンクを埋め込むこともできなくなりますが、それはoEmbed固有のJavaScriptを削除し、oEmbed結果のフィルタリングを無効に
し、oEmbedリンク発見を削除し、またすべての埋め込みリライトルールを削除
します。

Perfmatters、コンフィギュレーションガイド。 1

XML-RPCを無効にする

XML-RPC は WordPress 3.5 で追加されたリモート接続を可能にするプロトコルであり、WordPress App を使用してモバイルからブログを公開または編集する場合を除き、深刻なセキュリティリスクをもたらすため、 無効化することが重要です。

これを必要とするプラグインは非常に少なく、私が知っているのはこれを使用しているJetPackだけです。多機能なプラグインですが、パフォーマンスをかなり阻害するため、推奨できません。

XML-RPCXML-RPCを無効にしたら、yourdomain.com/xmlrpc.phpにアクセスして、403エラーメッセージしか返さないことを確認するだけで、その状態を確認できます。

このチェッカーでも確認することができます。このようなメッセージが表示された場合は、XML-RPCが無効になっていることを意味します。

Perfmatters、コンフィギュレーションガイド。 11

Perfmatters、コンフィギュレーションガイド。 1

jQuery Migrateの削除

WordPress 3.6で導入され、WP 5.5以降ではデフォルトで有効でなくなりました。

ほとんどのテンプレートやプラグインには必要ありませんが、細かい機能で必要なものもまだあります。私の場合、これを使うプラグインはUltimate Membership Proと、管理者のみに表示される統計バー(私は使っていない)のためのRank Mathの2つです。最近まで一部のCookie同意管理プラグインがまだ使用していました。

jQuery Migrateは、古い依存関係を持つコードが新しいコードと通信できるようにするための開発者向けリソースです。

そのため、jQuery Migrateはjquery-migrate.min.jsというJavaScriptの不要なオーバーヘッドを追加しているのです。

Perfmatters、コンフィギュレーションガイド。 13

ただし、無効にする前にプラグインのドキュメントを確認するか、開発者に問い合わせてください(特定のサイトに対して無効にする方法は後ほど紹介します)。

Perfmatters、コンフィギュレーションガイド。 1

WordPressのバージョンを隠す

このオプションには何の不思議もなく、単にセキュリティ対策としてインストールされているWordPressのバージョンを詮索されないようにするものです。

これは、様々な方法で行うことができますが、アップデートが遅れた場合に、そのバージョンに脆弱性が現れ、それが悪用されたり、コアが侵害されたりする場合に有効です。少なくとも、バージョンを隠すことで、抜け穴を狙う攻撃者の手を煩わせないようにすることができます。

たった1行のコードが削除されるだけで、主にセキュリティのために行われますが、最適化マニアにとっては、引くべき合計を増やすだけのピンチなのです。

Perfmatters、コンフィギュレーションガイド。 1

wlwmanifestのリンクを削除します。

これは、WordPressをインストールすると必ず表示されるタグで、2017年1月に更新とサポートを停止したWindows Live Writerで使用されていたものです。

上記のように、不要なコードだけなので、1行減ります。

Perfmatters、コンフィギュレーションガイド。 1

RSDリンクの解除

WordPressをインストールすると必ず表示される、もうひとつの置き土産タグ。

ブラウザからサイトを編集するのであれば、全く必要ありません。また、XML-RPCリクエストを使用する一部のサードパーティアプリケーションで使用されており、すでに無効になっているはずです。つまり、不要なコードを削除するわけです。

Perfmatters、コンフィギュレーションガイド。 1

ショートリンクの削除

このタグを追加したページや投稿に、番号付きの短いリンクを作成するために使用します。

<link rel='shortlink' href='https://dominio.com?p=123' />
Perfmatters、コンフィギュレーションガイド。 18

domain.com/%postname%といった「素敵な」短いパーマリンクを使っているのであれば、この未使用の、より不要なコードを捨てておく理由はありません。

Perfmatters、コンフィギュレーションガイド。 2

RSSフィードを無効にする

WordPressは、デフォルトでさまざまな種類のRSSフィードを生成します。RSSフィードはブログでも有用ですが、サイトが静的であったり、単にブログとして使用しない場合は、フィードを無効にすることができます。

Perfmatters、コンフィギュレーションガイド。 2

RSSフィードからのリンク削除

WordPressがRSSフィードを生成するのと同様に、ページ、投稿、コメント、カテゴリ、タグなどのRSSフィードへのリンクも生成されます。RSSフィードを有効にしたまま、RSSフィードのリンクを削除することができます。この目的は、あなたのページから追加の、そしてほとんどの場合使われていないコードを削除することです。

Perfmatters、コンフィギュレーションガイド。 1

オートピンバックを無効にする

pingbackとは、基本的に他のブログからリンクされた際に、自分のブログに通知として作成されるリンク付きの自動コメントのことです。オートピンバックは、自分のブログ内の記事にリンクを貼ることで作成されます。

今ではほとんど誰も使っていませんし、あなたが受け取るかもしれない外部ピングバックはたいていスパム的で、リソースを浪費するだけで、悪意のあるリンクや壊れたリンクを一時的に作成することさえあり、したがってSEOに有害なのです。
トラックバックと同様、ブログの理念としてのリンクがネチケットの一部として伝統的に行われていた過去のブログに
属するものです。

REST APIを無効にする

Perfmatters、コンフィギュレーションガイド。 22

WordPress REST APIは、WordPressのデータ型に対応したAPIエンドポイントを提供し、開発者はJSONオブジェクトを送受信することでサイトとリモートで対話できるようになります。

他のサイトや、PHPなどの言語で書かれたソフトウェアとデータを相互参照することができるのです。

Perfmattersによると、REST APIを使用するさまざまなプラグイン、サービス、アプリケーションがありますが、これらはその一部です。

Yoast SEOとRyteのダッシュボードウィジェット、Jetpack、いくつかのコンタクトフォーム、Wordfence、いくつかの特定のWooCommerceダッシュボードウィジェット。
また、Gutenbergブロックエディターでは、ページや投稿の編集を行う際の通信に使用されます。完全に無効にすると、「アップデートに失敗しました」というエラーが表示されます。

Perfmattersは3つのオプションを提供しています。有効(デフォルト)、管理者以外は無効ログアウト時は無効

Perfmatters、コンフィギュレーションガイド。 1

REST APIバインディングの削除

デフォルトでは、REST API のリンクが型のヘッダーに含まれます。

<link rel='https://api.w.org/' href='https://domain.com/wp-json/' />

また、各リクエストでヘッダーが送信され、APIタグがRSD(Really Simple Discovery)エンドポイントに追加されます。このコードは、リンクを削除するオプションを有効にすることで、すべて取り除くことができます。

Perfmatters、コンフィギュレーションガイド。 1

Googleマップを無効にする

ただ、Google Maps APIを無効化することです。

WordPressのテンプレートやプラグインには、Google Maps APIが組み込まれているものがあり、無効にする方法が提供されていないことが多いようです。Google Mapsは、リクエストが非同期で読み込まれるにもかかわらず、ブログのパフォーマンスに大打撃を与えることがあります。通常、Google Mapsの公式APIからリクエストします。

ブログに地図を読み込むだけで、Google Mapsに最大20のHTTPリクエストを行うことができます。統合によって、要求の数を減らしたり、増やしたりすることができます。

必要ない場合は、無効にしてください。

郵便番号によるGoogle Mapsの利用停止を除く

ただし、やむを得ず地図を埋め込む場合は、地図を追加する必要がある投稿のみ無効化を除外することができます。そのためには、以下のボックスに、各投稿のIDをカンマで区切って追加する必要があります。

Perfmatters、コンフィギュレーションガイド。 25
投稿のIDを知るには、管理メニューの「投稿」/「すべての投稿」を開き、各タイトルにマウスを乗せると下部に表示される編集リンクから知ることができます。

Perfmatters、コンフィギュレーションガイド。 26

Perfmatters、コンフィギュレーションガイド。 1

パスワード強度計の無効化

WordPressとWooCommerceの最新バージョンで導入されました。これは、ユーザーに強力なパスワードを使用するように強制する組み込みのパスワード強度計で、次のような複数のファイルを読み込みます: /wp-admin/js/password-strength-meter.min.jsおよび /wp-includes/js/zxcvbn.min.js

Perfmatters、コンフィギュレーションガイド。 28

zxcvbn.min.jsは800KBを超える場合があります。

Perfmatters、コンフィギュレーションガイド。 29

WooCommerceを使用している場合、このパスにもファイルがあることがあります。

/wp-content/plugins/woocommerce/assets/js/frontend/password-strength-meter.min.js

各テンプレートや開発者がどのようにキューに入れたかによりますが、これらのファイルはサイト全体に読み込まれることもあります。パフォーマンス上の理由から、「アカウント」、「支払い」、「パスワードリセット」ページでのみ読み込まれる必要があります。

この機能を無効にした後も、リクエストの中にこれらのスクリプトを見つけた場合は、テンプレートのドキュメントと、この機能を利用していると思われるプラグインのドキュメントを参照してください。

Perfmatters、コンフィギュレーションガイド。 2

コメントを無効にする

もしあなたがコメントを必要としない場合、または最も根本的な方法でスパムを終わらせることを決めた場合、読者がコメントするためのオプションを無効にすることができます。コメントフォームが消えます。

これは、Disable commentsオプションが有効な場合にPerfmattersが実行しようとするアクションのリストです。

  • 内蔵の最近のコメントウィジェットを無効化します。
  • X-Pingbackのヘッダーを外す。
  • コメントフィードのリンクを削除
  • コメントフィードのリクエストを無効にする。
  • 管理バーからコメントリンクを削除
  • すべての投稿タイプでコメントサポートを削除。
  • コメントフィルターを閉じます。
  • 管理メニューからコメントリンクを削除する。
  • 内蔵のディスカッションページを無効にする。
  • コントロールパネルからコメントを非表示にする。
  • プロフィールページからコメント設定オプションを非表示にしました。
  • 要求があれば、白紙のコメントテンプレートを返す。
  • コメント返信スクリプトを削除しました。

なお、ソフターオプションを選択した場合、このボックスのチェックを外すことで、各投稿の編集画面から特定の投稿のみコメントをクローズすることができます。

Perfmatters、コンフィギュレーションガイド。 31

また、設定/コメントから、特定の日数が経過したら閉じるように設定することもできます。

Perfmatters、コンフィギュレーションガイド。 32

Perfmatters、コンフィギュレーションガイド。 2

コメントからURLを削除

WordPressのコメントには、デフォルトで、コメント作成者の名前にnofollowリンクを作成するウェブサイトフィールドが含まれています(スパマーはこれを気にしませんが)。

時間が経つとリンクが切れてしまう、コメントが少なすぎる、単にスパムを駆除したい、といった場合に、訪問者がコメントで追加したURLを一挙に削除することが可能です。

これを有効にすると、今後のコメント用フォームからURLフィールドも削除されます。

Perfmatters、コンフィギュレーションガイド。 2

空白のファビコンを追加する

すでにサイトにファビコンを表示している場合は、このオプションを無効のままにしてください。

白いファビコンを追加することは、WordPressの新規インストールをたくさん作成し、テストする場合に便利です。空白のファビコンを追加することで、サイトごとにファビコンをアップロードする手間を省くことができます。また、忘れてしまうと、スピードテストツールで404エラーが発生することもあります。

Perfmatters、コンフィギュレーションガイド。 1

グローバルスタイルの削除

WordPress 5.9から、デュオトーン・スタイルを強化するインライン・コード(CSSとSVGのコード)が追加されました。おそらくほとんどのユーザーはこの機能を使わないでしょうし、問題は、このように分割されたサイトの各ページに311行(未定義)のコードが追加されることです。

タグの前に196行のCSS、タグの前に115行のSVGコードを追加しています。

コードの多くに!important;タグが使われていますが、これも理想的ではありません。
Perfmattersは、これがバグである可能性があると考えており、解決されるまでの間、この不要なコードをすべて削除する簡単な方法として、このオプションを追加しています。

ヒアビート、レビュー、オートセーブ

Perfmatters、コンフィギュレーションガイド。 36

WordPress Heartbeat APIは、/wp-admin/admin-ajax.phpを使用して、WebブラウザからAJAX呼び出しを実行します。

これは、下書きを保存し、予期せぬシャットダウンで下書きが失われるのを防ぐという点で優れていますが、CPU使用率が高く、PHPの呼び出しが異常に多くなる可能性もあります。例えば、コントロールパネルを開いたままにしておくと、このファイルに対して15秒ごとに一定の間隔でPOSTリクエストを送信し続けることになります。これを緩和するために、60秒まで周波数を上げることができます。

最初のオプションでは、いつ、どこでトリガーされるかを選択することができます。

3番目のオプションは、スペースを節約するために、エントリーのリビジョン数を制限することができます。例えば、10に設定すると、最後の10件だけが保存され、前のものは削除されます。

最後に、下書きの自動保存間隔を設定することができます。デフォルトでは、WordPressは60秒ごとに自動的に保存されます。しかし、間隔を長くすると、手動で保存する頻度が高くなります。これは、管理領域にいる間にブラウザがそれほどクラッシュするのを防ぎ、またデータベースへの書き込みを少なくするためです。

Woocommerce

Perfmatters、コンフィギュレーションガイド。 37

WooCommerceの最適化オプションについては、「ある」としか言いようがありませんが、この家では、あまりはっきりしないことはレビューしないのが通例なので、コメントは控えさせていただきます。2021年7月にWooCommerceをアンインストールしており、これらの最適化への対応についてはほとんど覚えていないので、そのドキュメントを参照することにしています。

ログインURL

Perfmatters、コンフィギュレーションガイド。 38

また、WordPressがyourdomain/wp-adminに設定する管理エリアへのデフォルトのログインURLを変更できるのも面白い機能です。のようなプギンスと全く同じことをする。 WPS Hide Login.

3つのフィールドが表示されます。

1つ目は、wp-adminのログインURLを「yourdomain.com/potato」のように好きなものに変更することで、通常デフォルトのURLを狙うブルートフォース攻撃などを回避することができます。書き留めておくか、文字数の多い変なURLにしないようにして、忘れないようにしましょう(wp_options/perfmatters_optionsテーブルに行けば、いつでも取得できますが)。

Perfmatters、コンフィギュレーションガイド。 39

2番目のフィールド(Disabled Behavior)は、yourdomain/wp-adminに到着した訪問者がどのURLに送られるかを3つの可能性で設定します。

  • Message(デフォルト):訪問者へのメッセージを表示します。フィールドに好きなテキストを追加して、メッセージをカスタマイズすることができます メッセージ.
  • 404 Template: ユーザーは404ページに移動します。
  • Home URL:ユーザーをトップページにリダイレクトします。

資産

ここからが本当に面白いんです。

Perfmatters、コンフィギュレーションガイド。 1

スクリプトマネージャー、ケーキの上のアイシング

Perfmatters Script Managerは、間違いなく彼らの最も強力で有用なツールです。 これだけでも、プラグインとそのサポートのために支払う少しのペニーの価値があります。

各プラグインが使用するスクリプトやCSSを無効にし、投稿やページ、場所やサイト全体で読み込まないようにしたり、ログインしているユーザーやログアウトしているユーザー、デバイスでフィルタリングしたり、カテゴリーやタグでも例外を追加したりすることができます。

Perfmatters, guía de configuración y uso. Script manager

これにより、フォームなどプラグインが使用されていない不要なリクエストを排除することで、読み込み速度(特にトップページ)を飛躍的に向上させることができます。

Perfmatters、コンフィギュレーションガイド。 42

強制使用モード(MU)は、Script Managerをさらに進化させたものです。WordPressのプラグインクエリーやフック、インラインCSSやJSを無効化することができ、より高度な制御が可能です。プラグインのフロントエンドスクリプト、インラインコード、MySQLクエリなど、プラグインのあらゆる面を好きな場所でコントロールできるようになりました。

グローバルビューには、適用されているすべての設定が表示されます。これは、ある日突然、設定を並べ替えたり、変更したり、新しい設定を追加したり、一部を削除したりする必要がある場合に備えています。

Perfmatters、コンフィギュレーションガイド。 43

ドキュメントもかなり充実しています。この種のツールに慣れていないと、最初は戸惑うかもしれませんが、使ってみるとすぐに、とても使いやすいことがわかります。

ジャバスクリプト

Perfmatters、コンフィギュレーションガイド。 44

JavaScriptを延期 遅延させる。

いずれもFCPと LCPの向上に貢献することができます。

重要でないすべてのJavaScriptファイルにdefer属性を追加すると、ページの最初のコンテンツペインティング(FCP)が高速化されます。つまり、JavaScriptはHTMLのパース中にダウンロードされ、ページの読み込みが終わった後(パース終了時)に実行されます。つまり、javascriptのダウンロードはページの一番下に押し込まれ、最後に行われるようになっているのです。

遅延が ある場合、LCPとTBTの結果は改善されます。JavaScriptは、Google Adsense、Google Analytics、FacebookコンバージョンピクセルまたはGoogle Adsと同様のようなサードパーティからの重いスクリプトなど、何かがすぐに必要とされていないときにページの最初の絵を高速化し、ユーザーの相互作用に応じて遅延させることができます。

どちらのオプションでも、例外を追加したり、「遅延タイムアウト」動作を有効にしたりすることができます。これはオプションであり、デフォルトでは無効になっている。

Perfmatters、コンフィギュレーションガイド。 1

ディレイタイムアウト

このオプションを有効にすると、これらのフィルタのいずれかを使用して、遅延タイムアウトを別の値に設定することができます。

例のものでは7秒に設定しています。

add_filter('perfmatters_delay_js_timeout', function($timeout) {
    return '7';
});

タイムアウトの値を短くしすぎると、JSディレイ機能が正しく動作しなくなるとのことです。また、タイムアウトに関係なく、99%の確率で、スクロール、クリック、マウスの動きなど、最初のユーザーインタラクションですべてが起動します。

CSS

Perfmatters、コンフィギュレーションガイド。 46

Perfmattersによると、「未使用のCSSを減らす」という警告を解決する最も簡単な方法は、まだベータ版のときに私がレビューした、すべてを自動的に行うこの機能を有効にすることだそうです。開発者は、何百ものURLで(異なるテンプレートや設定を使って)テストを行い、これらの結果を得たと主張しています。

  • FCPの平均減少率は15.20%。
  • LCPの平均減少率は19.66%。
  • 平均TTIは14.95%減少。

Perfmattersの「未使用のCSSを削除」機能を有効にする前に、Perfmattersで設定されている既存のCSSプリロード(Google Fontsローカルスタイルシートは除く)を削除することを推奨しています。
CSSをマージしない(WP Rocket、Litespeed、Autoptimizeなどでよく行われること)。CSS マージは HTTP/2 以降、時代遅れの最適化手法です。CSSを組み合わせるとパフォーマンスが低下する場合があります(私の
場合はそうではありませんでした)。最後に、他のプラグインで未使用のCSSを削除しようとしていないか確認してください。

除去の方法は3種類あります。

  • Delay(デフォルト)。オリジナルのCSSスタイルシート(未使用のCSS)はすべて遅延され、ユーザーインタラクション時に読み込まれます。これは推奨されるオプションです。
  • 非同期:オリジナルのCSSスタイルシート(未使用のCSS)は、すべて非同期で読み込まれます。この方法は、ページの読み込み中にスタイルシートが非同期で実行されるため、ポップインを回避するのに役立ちます。この方法では、LCP/FCPが遅延動作より若干高くなります。
  • Remove:オリジナルのCSSスタイルシート(未使用のCSS)をすべて削除します。これは最も積極的な方法ですが、おそらく例外を追加する必要があるでしょう。上級者のみにお勧めします。

テスト環境で実験し、単独でも他の機能との相互作用でも結果を測定すること以外に、ここに秘訣はないのです。

Perfmatters、コンフィギュレーションガイド。 47

これらの機能の一部は、WP編集で任意の投稿やページで無効にすることができます。

コード

Perfmatters、コンフィギュレーションガイド。 48

他の多くのプラグインが搭載している便利な定番、手作業でもできることですが、ブログのヘッダー、本文、フッターにカスタムコードを追加する操作を簡略化、容易にするものです。

以下のフィールドは、フロントエンドに直接コードを出力するため、有効なHTMLである必要があります。

PHPなどのサーバーサイド言語には対応していません。カスタムPHPコードを追加するには、Code Snippetsプラグインを使用することをお勧めします。

プリロード

Perfmatters、コンフィギュレーションガイド。 49

プリロードでは、最初の「Instant Page」というオプションは、instant.pageライブラリを使用し、2KB以下の小さなJSファイル(instantpage.js)をあなたのサイトのローカルに読み込み、ユーザーがリンク、またはデスクトップ版の画像にマウスを合わせたときにURLをプリロードするために使用されます。モバイルでは、ユーザーが画面上のリンクをタップし始めた後、それを離す前にURLがあらかじめ読み込まれます。

65ミリ秒後に、バックグラウンドで自動的にURLのプリロードが開始されます。

このツールは、Litespeedの「Instant Click」やWP Rocketの「Preload Links」に相当するものなので、この2つのプラグインのどちらかでこのオプションを使用している場合は、Perfmattersを試すためにこれを無効化する必要があります。

私の場合、Litespeedの同等のオプションよりも少し効果がありましたが、場合によってはサーバーの負荷を増加させる可能性があることに注意する必要があります。

JavascriptやCSSのオプションと同様に、プリロードとプリコネクションの使用は、さまざまなテストに基づくニーズに応じて使用する必要があります。

Perfmatters、コンフィギュレーションガイド。 50

重要な画像(フォールドより上の画像)のプリロードは、まだベータ版ですが、Core Web Vitalsの大きなコンテンツ(LCP)のペイントにかかる時間を短縮するのに役立つオプションです。

これらは通常、ロゴ、投稿の特集画像、ランディングページのメイン画像などのような画像です。プリロードすると、滝の一番上に移動し、ブラウザに「優先的に読み込むべきものです」と伝えることができます。

プリロードは0枚(デフォルト)、5枚から選択できます。Chromeでは、滝の上部に表示されるプリロード画像は2枚までなので、せいぜい2~3枚を選ぶことをパーマッターズは推奨しています。

レイジーローディング

Perfmatters、コンフィギュレーションガイド。 51

WordPressが2020年にリリースした5.4からネイティブで搭載した、もう一つのパフォーマンスに関する定番。

私の場合、テストでは若干良い結果が得られたのでLitespeedオプションを使用していますが、それでもPerfmattersのものは本当によく機能し、また背景画像のCSSにも適用されます。

フォント

Perfmatters、コンフィギュレーションガイド。 52

もうひとつ、いいことがあります。このオプションは、.NET Framework 1.7.4で追加されたものです。パーフマターズは、2022年6月7日に発売されました。数回のクリックでGoogle Fontsをローカルにホストし、ロードすることができます。

フォントをローカルにホスティングする利点はたくさんあります。フォントを完全に制御でき、すべてのリクエストを排除できるため読み込み時間が短縮され、フォントの提供方法を決めることができます。

この機能は、あなたのブログに存在するGoogle Fontsの参照を自動的に探し出し、fonts.google.comから対応するフォントをダウンロードして、あなたのサーバー上のディレクトリ:/wp-content/cache/perfmatters/your-domain.com/fonts/にローカルにホスティングします。

この記事では、その使用方法について詳しく説明しています。

CDN

Perfmatters、コンフィギュレーションガイド。 53

特別なことは何もなく、コメントすることはほとんどありません。ツールで、いつも使っているCDNを追加しておくと便利です。QUIC.CLOUDを使用しているため、まだ必要ありません。

アナリティクス

Perfmatters、コンフィギュレーションガイド。 54

Matomoへの移行を開始し、Analyticsスクリプトの管理をRGPD/CCPA用のクッキー同意管理プラグインに追いやり、こちらも正しく管理しているので今は使っていませんが、昔使っていたのでPerfmattersと非常に相性が良いことは知っています。

ここから、Google Analyticsのスクリプトをローカルにホストすることができます。これは、追加のDNSルックアップを減らし、彼らのスクリプトの「ブラウザのキャッシュを悪用する」問題を解決することによって、サイトを高速化するのに役立ちます。

Perfmattersによると、皮肉なことに、Google自身のスクリプトはキャッシュに関する警告を吐くが、これはHTTPキャッシュヘッダの有効期限が非常に短いためであるとのことだ。自分でホストしている場合は、自分のCDNやサーバーのHTTPキャッシュヘッダが自動的に適用されます。つまり、スクリプトのキャッシュを完全に制御することができます。

また、このツールはGoogleが公式にサポートしているわけではないが、何年も問題なく使用されているとのことです。

Google Analyticsをローカルでホスティングし、独自のCDNやサーバーからスクリプトを提供することで、単一のHTTP/2接続を利用することも可能です。

この記事には一部アフィリエイトリンクが含まれています。

電子メールによる購読

広告なしの記事全文を、公開と同時に無料で受信できます。 フィードの全コンテンツは、外部サービスを通じて広告なしで送信されます。