Cloudflare Cache Everything は WordPress TTFB を 90% 改善します

サイトの速度がブログにとって重要な要素であることはご存知でしょう。 Cloudflare キャッシュのすべては、物事をスピードアップするのに本当に役立ちます。

訪問者は、Web ページが読み込まれるまで数秒以上待つことはありません。 Google は、応答時間が検索ランキングの重要な要素であることを明確にしています。 そうです、今日のサイトにとって速度は重要です。

WordPress を使用すると、デスクトップで適切なページ読み込み速度を得るのは比較的簡単です。 しかし、モバイルの速度はそれほど簡単ではありません。

ただし、Cloudflare ページ ルールを使用してサイトの速度を劇的に改善する方法があります。

Cloudflareを使用していますか?

サーバー側の応答時間を改善するための最初のステップは、サイトを CDN (コンテンツ配信ネットワーク) で実行することです。

最も人気のあるサービスは、効果的で信頼性が高く、無料であるため、ほとんどのブロガーにとって Cloudflare です。

サイトを Cloudflare に追加する必要がある場合は、WP Beginner によるこのチュートリアルを開始するのに最適です。

しかし、すでに使用している場合は、最初のバイトまでの時間 (TTFB) のパフォーマンスを劇的に向上させることができます。

これは、サイトの読み込み速度にとって最も重要な要素の 1 つです。

以前の記事で、3 つのページ ルールを使用して WordPress 管理ページの速度を向上させることについて書きました。

ただし、この修正では、Cloudflare のすべてをキャッシュするルールを使用する必要があります。

無料の Cloudflare アカウントを使用している場合は、3 つのページ ルールしか取得できません。

そのため、既存のページ ルールを変更する必要があります。

しかし、それは努力する価値があります。

TTFBの削減

これらの変更が TTFB 速度に与える影響の例をいくつか示します。

下の 2 つの画像は、Chrome Deleveopers Tools を使用して、モバイル速度にどれだけの違いをもたらすことができるかを示しています。

1 つ目は最適化されておらず、TTFB は 1.55 秒です。

新しい Cloudflare ルールを追加した後、ここで改善を確認できます。 TTFB は現在、わずか 33.25 ミリ秒です。

私の Freshping アカウントから、私が最適化した 3 つのサイトの全体的な応答時間を確認できます。

まだ完全にキャッシュされていない 4 つのサイトよりも 90% 高速です。

Cloudflare キャッシュのすべてを適用する方法

これらの変更を行う前に、警告の言葉があります。

この方法は、あまり頻繁に変更されない適度に静的なサイトにのみ適しています。

ウィジェットの変更、Twitter フィード、スライダー、定期的な情報の更新など、動的なコンテンツがある場合はお勧めできません。

Cloudflareにキャッシュのすべてを追加すると、それは言うことを行います.

Cloudflareダッシュボードからこのサイト速度の改善を追加する方法は次のとおりです.

まず、新しいルールを追加する必要があります。 トップ メニューのページ ルール アプリ ボタンをクリックします。

すでに 3 つのルールがある場合は、1 つを削除する必要があります。 私の場合、*preview=true* ルールを削除しました。

ここで、Web サイト URL の新しいページ ルールを追加し、両端にワイルドカード スターを付けます。

次に、これらのルール設定を追加します。

ブラウザ キャッシュ TTL – 1 時間
キャッシュレベル – すべてをキャッシュ
エッジ キャッシュ TTL – 7 日

[保存] をクリックすると、すべてがキャッシュ コントロール ヘッダーに設定されます。

重要な注意事項の 1 つは、上の画像のようにルールを並べ替えていることを確認することです。

管理ページのオリジン キャッシュ コントロールを保護するために、サイト キャッシュ ルールは wp-login および wp-admin ルールの後に配置する必要があります。

また、Cloudflare ブラウザーのキャッシュ設定をチェックして、[既存のヘッダーを尊重する] が選択されていることを確認する必要があります。

ロケットローダーをチェック

Cloudflare の Rocket Loader を使用しているかどうかを確認することもできます。

機能する場合は非常にうまく機能しますが、サイトが壊れる可能性もあります. 2 つのサイトで実行していますが、問題ありません。

しかし、別のサイトでは問題が発生するため、オフにしました。

すべての設定が正しいことを確認したら、サイトにアクセスして、すべてが期待どおりに機能しているかどうかを確認します。 現在、ほぼ瞬時にロードされているはずです。

次に、Google Page Speed Insights、GTMetrix、または Pingdom でサイトの速度をチェックして、改善を確認します。

目標は、TTFB の場合は 200 ミリ秒未満、完全にロードされた場合は 2 秒未満である必要があります。

これは、GTMetrix 上の私のサイトの 1 つの読み込みタイミングのスクリーンショットです。 わずか0.6秒で満タンになっていることがわかります。

1つの欠点と解決策

サイトのすべてがキャッシュされるようになったため、行った変更はキャッシュ サイクルがクリアされるまで有効になりません。

これには長い時間がかかる場合があります。

したがって、新しい投稿を追加したり、既存の投稿を編集したりしても、変更は表示されません。 サイトの新しいコメントにも適用されます。

これを回避する唯一の方法は、Cloudflare プラグインをインストールすることです。

プラグインを追加するのは好きではありませんが、これはこの速度修正に不可欠です。

追加したら、自動キャッシュ管理をオンに変更します。

作成または編集した個々のファイルをパージし、元の Web サーバーから新しいファイルをキャッシュします。

プラグインから、サイト全体をパージすることもできます. ただし、このアクションによりロード時間が長くなります。

キャッシュの問題を回避して問題を調査したい場合は、Cloudflare で Web サイトを一時停止することをお勧めします。

絶対にクリックしてはいけないボタンは、WordPress 用に Cloudflare を最適化することです。

変更すると、多くの設定が変更され、望ましくない可能性があります。 これらには、HTML、javascript、および CSS の縮小と、既存のヘッダー設定の変更が含まれます。

更新: 新しい、はるかに優れたソリューション

この記事を書いて以来、Cloudflare Cache Everything のほぼすべての問題を解決する新しい無料の WordPress プラグインが利用可能になりました。

Super Page Cache for Cloudflare はインストールが簡単で、多くの制御が可能です。

このプラグインは、静的ファイル (CSS、JS、画像など) だけでなく、WordPress によって生成された HTML Web ページも、サーバーのディスクレベルとグローバル Cloudflare CDN の両方でキャッシュするのに役立ちます。

サイトの 1 つにインストールしましたが、問題なく動作しました。 TTFB は、ほぼ 1 秒から 0.2 秒未満に低下しました。

無料サービスではないCloudflare APOに匹敵します。

しかし、無料の Cloudflare アカウントを使用する場合、この無料のプラグインは、APO が実行できるほとんどすべてのことを実行します.

Just Publishing Advice でこのキャッシュ プラグインを使用すると、優れた Core Web Vitals の結果を簡単に得ることができます。

このサイトの任意のページを PageSpeed Insights または GTMetrix でチェックして、すべてのキャッシュがどの程度うまく機能しているかを確認できます。

オールグリーンの結果が得られなかったとしたら、私は驚かれることでしょう。

読み込み速度と Core Web Vitals を改善したい場合は、一見の価値があります。

概要

Cloudflare Cache すべてが非常にうまく機能し、サイトを大幅に高速化します。 特にモバイルサイトの速度向上に効果的です。

ただし、すべてのサイトに当てはまるわけではなく、テーマ、機能、サイトのデザインによっては欠点が生じる可能性があります.

このキャッシュ方法は非常に攻撃的であるため、すべてを再確認してください。

理想的には、ステージング サイトまたはサンドボックス サイトで試して、サイトが問題なく動作することを確認する必要があります。

ライブ サイトに実装して問題が発生した場合は、いつでもページ ルールを削除できます。 次に、Cloudflare でサイトを完全にパージします。

その後、開始した場所に戻ります。

サポートが必要な場合は、Cloudflare サポートに静的コンテンツのキャッシュとすべてのキャッシュに関するエントリが多数あります。