PCやスマホなど、使用しているデバイスに関わらず、サイト訪問者は、当然高速なページを期待しているもの。ページの読み込みに時間がかかると、競合他社のサイトに移動してしまうかもしれません。また、サイトのパフォーマンスが検索結果に与える影響も気になります。

Kinstaは、サイトの速度を重視し、お客様のサイトの高速化を常に考慮しています。

2022年12月に、ウェブページの配信をさらに高速化するWordPress専用マネージドホスティングの新機能、エッジキャッシュをリリースしました。

TTFB(Time to First Byte)を測定したところ、エッジキャッシュ有りの平均応答時間は207ミリ秒、エッジキャッシュ無しの場合では402.59ミリ秒と、エッジキャッシュを利用すると約49%短縮することがわかりました。また、実際にこのテストを行った一部のサイトでは、この数値を超えるパフォーマンスの向上が見られ、TTFBが80%近く低減しています。この数値については、後ほどご説明します。

この記事では、WordPressサイトのコンテンツが「エッジ」に置かれることで、パフォーマンスがどのように向上するかを見ていきます。

エッジキャッシュとは

KinstaのWordPress専用マネージドホスティングを利用する方の多くは、すでにKinstaのCDNを通じてエッジサーバーを含むCloudflare統合を活用しています。コンテンツデリバリネットワークは、サイトの静的アセット(画像、フォント、CSSやJavaScriptを含むファイルなど)を世界中のCloudflareのネットワーク上の260+箇所に配置。つまり、静的アセットがサイト訪問者に物理的に近い場所から配信されるようになります。コンテンツがユーザーの近くで配信されるようになれば、ネットワークレイテンシも軽減されます。

WordPressサイトのHTMLページのエッジキャッシュは、CDNで静的アセットを管理する仕組みとほぼ同じです。違いと言えば、その複雑さにあります。画像などのほとんど変更がないファイルのキャッシュ管理は比較的容易ですが、動的に生成され、静的コンテンツとしてキャッシュ対象となり、編集するたびに再生成されるタイプのコンテンツの管理は、難易度が上がります。

コンテンツがエッジキャッシュされる仕組み

エッジキャッシュは、ブラウザがウェブページにリクエストを出すことで生成されます。ページがまだキャッシュされていない場合は、リクエストはWordPressサイトに渡され、そのページがローカルキャッシュにない場合には、WordPressで再生成されます。ブラウザに返されるページは、その過程でエッジキャッシュに保存されます。これによって、今後同じ経路を辿るリクエストは、キャッシュがクリアされない限り、高速で処理されるようになります。

モバイル用キャッシュも同様です。ページへのリクエストがモバイル端末から送信された場合、コンテンツはモバイルキャッシュに保存されます(モバイルキャッシュにおいてiOSやAndroidなどは区別されず、タブレット端末からのリクエストは、PC用コンテンツと一緒に保存される)。

WordPressのローカルキャッシュとエッジキャッシュ

Kinstaでは、プラグインを使用せず、サイトのサーバー上にローカルキャッシュを保存することができます。エッジキャッシュ機能もこのシンプルさを重視し、ローカルキャッシュをクリアするのと同じ手順で、エッジキャッシュを同期します。

さらに、MyKinstaから簡単にエッジキャッシュをクリアすることができます。

また、エッジキャッシュならではの機能として注目したいのが、モバイル用キャッシュ。そのデバイスに固有のマークアップを持つページを生成する場合には、PC向けコンテンツとは別にモバイルキャッシュを利用するのが効果的です。

Kinstaのエッジキャッシュの機能はCloudflareのAPOと同じですか?

同じです。Kinstaのエッジキャッシュ機能は、Cloudflare自動プラットフォーム最適化(APO)サービスで使われているエッジサーバーの強力なネットワークを採用しており、APOはWordPressサイトにエッジキャッシュを提供するように設計されています。

Kinstaのエッジキャッシュには、以下のような特徴があります。

エッジキャッシュの速度テスト

この機能を正式にリリースする前に、Kinstaの一部のお客様にベータ版をお試しいただきました。世界各地で運営されているお客様のウェブサイトで実際にテストを行うことで、より信憑性の高いテスト環境を実現しました。

アイオワ州カウンシルブラフにあるGoogleのデータセンター(us-central1)から、自動化ツールを使ってテスト参加者のサイトを調査し、以下3つのシナリオで応答時間を測定しました。

  1. Cloudflareエッジサーバーのキャッシュからページが配信された場合
  2. Cloudflareエッジサーバーでページが見つからず、オリジンサーバーのローカルキャッシュから引き出された場合
  3. キャッシュされたページがなく、WordPressでPHPスクリプトとデータベースクエリを実行してページを動的に構築しなければならない場合

注目する点は、ローカルキャッシュとエッジキャッシュの応答時間の違いです。

以下の2つの応答時間を測定しました。

  1. Time to first byte(ページへのリクエストから最初の1バイトのデータを受信するまでの時間)
  2. HTMLページ全体をダウンロードするのにかかる時間

TTFBの測定は、ウェブサーバーとブラウザ間のネットワークレイテンシ、ページ全体のダウンロード時間の測定は、HTMLページをブラウザに届ける速度を調べるのに有用になります。

実際の数値で見るエッジキャッシュの効果

世界中のデータセンターでWordPressサイトを対象に、数百回にわたるテストを行った結果、エッジキャッシュは、ブラウザへのページ全体の配信速度を平均50%以上高速化することがわかりました。

以下、具体的な数値をご紹介していきます。

Chart showing improvements in TTFB and page-delivery speed thanks to Edge Caching.
TTFB: 402.59ミリ秒(ローカル)、207ミリ秒(エッジ)/ページ全体: 490.99ミリ秒(ローカル)、223.98ミリ秒(エッジ)

TTFBは平均約48.6%短縮、ページ全体の転送時間は約54.4%短縮されました。

長距離通信で80%以上の高速化を実現

速度テストの平均値はどれも好成績を残していますが、世界中のユーザーをターゲットにしている企業にとっては、長距離通信における速度が重要になります。

私たちが実施したテストで、エッジキャッシュを活用して、遠く離れたブラウザとオリジンサーバー間の溝を埋めることで、パフォーマンスが劇的に改善されることがわかっています。

例えば、アイオワ州のテスト拠点とシンガポールにあるGoogleのデータセンター(asia-southeast1)間では、エッジキャッシュによってTTFBが83.6%、ページ転送時間が85.6%短縮されています。

TTFB: 672.01ミリ秒(ローカル)、110.05ミリ秒(エッジ)/ページ全体: 901.1ミリ秒(ローカル)、129.79ミリ秒(エッジ)。
TTFB: 672.01ミリ秒(ローカル)、110.05ミリ秒(エッジ)/ページ全体: 901.1ミリ秒(ローカル)、129.79ミリ秒(エッジ)

また、シドニーのデータセンター(australia-southeast1)で運営されるWordPressサイトにアクセスしたところ、TTFBが約73.6%、ページ転送時間が77.3%短縮されました。

TTFB: 898.26ミリ秒(ローカル)、237.21ミリ秒(エッジ)/ページ全体: 1,130.48ミリ秒(ローカル)、256.95ミリ秒(エッジ)
TTFB: 898.26ミリ秒(ローカル)、237.21ミリ秒(エッジ)/ページ全体: 1,130.48ミリ秒(ローカル)、256.95ミリ秒(エッジ)

同様にメルボルンのデータセンター(australia-southeast2)でも、エッジキャッシュによってTTFBが平均77.8%、ページ転送時間が約82.7%短縮されました。

TTFB: 607.37ミリ秒(ローカル)、134.63ミリ秒(エッジ)/ページ全体: 812.46ミリ秒(ローカル)、140.62ミリ秒(エッジ)
TTFB: 607.37ミリ秒(ローカル)、134.63ミリ秒(エッジ)/ページ全体: 812.46ミリ秒(ローカル)、140.62ミリ秒(エッジ)

フィンランドのハミナにあるデータセンター(europe-north1)で運営されているサイトにアクセスすると、TTFBが約41.7%、ページ転送時間が56.3%以上短縮もされました。

TTFB: 579.81ミリ秒(ローカル)、338.17ミリ秒(エッジ)/ページ全体: 822.21ミリ秒(ローカル)、358.89ミリ秒(エッジ)
TTFB: 579.81ミリ秒(ローカル)、338.17ミリ秒(エッジ)/ページ全体: 822.21ミリ秒(ローカル)、358.89ミリ秒(エッジ)

ベルギーのサン=ギスランにあるデータセンター(europe-west1)では、TTFBとページ転送時間が 69%短縮しました。

TTFB: 464.64ミリ秒(ローカル)、143.13ミリ秒(エッジ)/ページ全体: 464.92ミリ秒(ローカル)、143.38ミリ秒(エッジ)
TTFB: 464.64ミリ秒(ローカル)、143.13ミリ秒(エッジ)/ページ全体: 464.92ミリ秒(ローカル)、143.38ミリ秒(エッジ)

英国ロンドンのデータセンター(europe-west2)で運営されるサイトでは、TTFBが58%、ページ転送時間が60.8%短縮。

TTFB: 372.4ミリ秒(ローカル)、156.17ミリ秒(エッジ)/ページ全体: 458.18ミリ秒(ローカル)、179.34ミリ秒(エッジ)
TTFB: 372.4ミリ秒(ローカル)、156.17ミリ秒(エッジ)/ページ全体: 458.18ミリ秒(ローカル)、179.34ミリ秒(エッジ)

ドイツのフランクフルトにあるデータセンター(europe-west3)では、 TTFBが約64%、ページ転送時間が67.5%短縮しました。

TTFB: 409.27ミリ秒(ローカル)、147.42ミリ秒(エッジ)/ページ全体: 507.52ミリ秒(ローカル)、164.98ミリ秒(エッジ)
TTFB: 409.27ミリ秒(ローカル)、147.42ミリ秒(エッジ)/ページ全体: 507.52ミリ秒(ローカル)、164.98ミリ秒(エッジ)

オランダのエームスハーヴェンにあるデータセンター(europe-west4)で運営されているサイトにアクセスすると、TTFBが約56%、ページ転送時間が63.6%短縮されました。

TTFB: 394.49ミリ秒(ローカル)、173.76ミリ秒(エッジ)/ページ全体: 538.84ミリ秒(ローカル)、195.82ミリ秒(エッジ)
TTFB: 394.49ミリ秒(ローカル)、173.76ミリ秒(エッジ)/ページ全体: 538.84ミリ秒(ローカル)、195.82ミリ秒(エッジ)

カナダのモントリオールにある データセンター(northamerica-northeast1)では、TTFBが10%以上、ページ転送時間が16.2%以上短縮されました。

TTFB: 325.3ミリ秒(ローカル)、292.28ミリ秒(エッジ)/ページ全体: 351.1ミリ秒(ローカル)、294.15ミリ秒(エッジ)
TTFB: 325.3ミリ秒(ローカル)、292.28ミリ秒(エッジ)/ページ全体: 351.1ミリ秒(ローカル)、294.15ミリ秒(エッジ)

オハイオ州コロンバスにある データセンター(us-east5)では、 TTFBとページ転送時間が約59%短縮。

TTFB: 326.69ミリ秒(ローカル)、133.97ミリ秒(エッジ)/ページ全体: 341.15ミリ秒(ローカル)、140.5ミリ秒(エッジ)
TTFB: 326.69ミリ秒(ローカル)、133.97ミリ秒(エッジ)/ページ全体: 341.15ミリ秒(ローカル)、140.5ミリ秒(エッジ)

ネバダ州ラスベガスにあるデータセンター(us-west4)では、TTFBが54.7%以上、ページ転送時間が57.3%以上短縮しています。

TTFB: 366.73ミリ秒(ローカル)、165.88ミリ秒(エッジ)/ページ全体: 413.39ミリ秒(ローカル)、176.63ミリ秒(エッジ)
TTFB: 366.73ミリ秒(ローカル)、165.88ミリ秒(エッジ)/ページ全体: 413.39ミリ秒(ローカル)、176.63ミリ秒(エッジ)

私たち以外にも、Kinstaのエッジキャッシュの速度テストを行った人がいます。

デジタルエージェンシーforgemediaの共同設立者、Brian Jackson氏は、エッジキャッシュを利用して、ブラウザでTTFBやページのレンダリングの時間、LCP(Largest Contentful Paint:最もサイズの大きなコンテンツが読み込まれるまでにかかった時間)を測定し、その結果をTwitterに投稿しています。

Brian Jackson氏のツイート(Twitterで見る)
Brian Jackson氏のツイート(Twitterで見る

SRH DesignのSimon Harper氏は、Kinstaのエッジキャッシュ有効後のTTFBとLCP、FCP(First Contentful Paint:アクセスしてからページ上のいずれかのコンテンツがレンダリングされるまでの時間)を測定しています。結果は、以下の通りです。

Simon Harper氏のツイート(Twitterで見る)
Simon Harper氏のツイート(Twitterで見る

なお、ウェブページの構造やJavaScript、CSS、画像などのリンクアセットがFCPやLCPに影響を与えることがありますが、いずれにしてもまず最初に受信されるのはHTMLページです。

Kinstaのエッジキャッシュを利用する

MyKinstaでWordPressサイトを作成すると、エッジキャッシュはデフォルトで有効化されるため、特別な設定は不要です。

2023年1月以降は、既存のサイトでも自動的にエッジキャッシュが有効になります。今すぐに既存のサイトでエッジキャッシュを利用するには、以下の手順で設定してください。

  • 左側ナビゲーションで「WordPressサイト」を選択
  • エッジキャッシュを利用したいサイト名をクリック
  • エッジキャッシュ」を選択
  • エッジキャッシュを有効にする」ボタンをクリック
MyKinstaでエッジキャッシュを有効化
MyKinstaでエッジキャッシュを有効化

モバイルコンテンツをエッジキャッシュする

サイトでモバイルブラウザを検出し、そのデバイスに固有のマークアップを持つページを生成する場合には、PC向けコンテンツとは別に、モバイルキャッシュを利用することができます。

以下の手順で設定してください。

  • 左側ナビゲーションで「WordPressサイト」を選択
  • エッジキャッシュを利用したいサイト名をクリック
  • エッジキャッシュ」を選択
  • モバイルキャッシュを有効にする」ボタンをクリック
モバイル端末のエッジキャッシュを有効化
モバイル端末のエッジキャッシュを有効化

なお、同じレスポンシブHTML/CSSマークアップで、PCとモバイルの両方のブラウザをサポートするウェブサイトの場合は、モバイルキャッシュの有効化は不要です。

キャッシュをクリアする

エッジキャッシュは、Kinstaのほとんどのお客様が既に使用しているキャッシュ管理機能とシームレスに動作するように設計されています。また、以下の手順でエッジキャッシュに絞って管理することも可能です。

  • 左側ナビゲーションで「WordPressサイト」を選択
  • エッジキャッシュを利用しているサイト名をクリック
  • エッジキャッシュ」を選択
エッジキャッシュをクリア
エッジキャッシュをクリア

すべてのロケーションでエッジキャッシュに保存されたページを削除するには、「キャッシュをクリアする」ボタンをクリックします。

特定のページやパスだけを削除するには、「URL指定キャッシュクリア」セクションにURLを貼り付けて、「URLを指定しキャッシュをクリア」ボタンをクリックします。「指定したURL下にあるすべてのサブディレクトリのキャッシュをクリア」にチェックを入れると、特定のパスの全コンテンツのキャッシュをクリアすることができます。

エッジキャッシュを拒否する

エッジキャッシュとサイトに互換性がないことがわかっている場合は、2023年1月に自動で有効化される前に、利用を拒否することができます。

以下の手順で行なってください。

  • 左側ナビゲーションで「WordPressサイト」を選択
  • エッジキャッシュを利用しているサイト名をクリック
  • このサイトでのエッジキャッシュ有効化を拒否する」のトグルをクリック
エッジキャッシュを拒否
エッジキャッシュを拒否

サイトでエッジキャッシュがすでに有効になっている場合は、「エッジキャッシュ」画面右上に「無効化する」ボタンが表示されます。これをクリックすればOKです。

エッジキャッシュを無効化
エッジキャッシュを無効化

エッジキャッシュに関するよくある質問

以下、エッジキャッシュに関する一般的な質問をご紹介します。

すべてのプランで無料で利用できますか?

すべてのプランで無料でご利用可能です。MyKinstaで作成したすべての本番サイトでは、デフォルトで有効になります。また、プレミアムステージング環境でもご利用いただけます。

モバイル版のサイトのパフォーマンスも向上しますか?

モバイル端末のマークアップを生成するサイトでは、モバイルキャッシュをご利用いただけます。同じレスポンシブHTML/CSSマークアップで、PCとモバイルの両方のブラウザをサポートするようなウェブサイトの場合は、モバイルキャッシュの有効化は不要です。

WordPress最適化プラグインの使用は必要ですか?

不要です。KinstaのWordPress専用マネージドホスティングでは、ローカルキャッシュ、エッジキャッシュ、世界で最も人気のあるCMSをサポートする高度に調整されたCDNをお使いいただけます。

エッジキャッシュを無効にすることはできますか?

MyKinstaで無効にすることができます。サイトがエッジキャッシュと互換性があるかどうかご不明な場合には、カスタマーサポートまでお気軽にお問い合わせください。

まとめ

インターネットの役割は、いつも世界中の人々をつなぐことにあります。しかし、サーバーと訪問者の物理的な距離が、サイトの知覚的なパフォーマンスに影響を与えることがわかっています。エッジキャッシュを活用すれば、コンテンツを訪問者に近づけ、TTFBやLCPなど、ページ高速化の鍵を握る要素を改善することができます。

WordPress専用マネージドホスティングの基本構成要素となるエッジキャッシュは、Cloudflare統合によるCDNとネットワークセキュリティ機能を強化するものです。

エッジキャッシュは、HTMLページをサイト訪問者に届ける時間を平均約半分に短縮。特に世界中のユーザーをターゲットにするサイトでは、劇的にサイト速度が高速化する可能性があります。

エッジキャッシュは、Kinstaをご利用のすべてのお客様に追加費用なしでお使いいただけます。セキュリティ、使いやすさ、パフォーマンスを考慮したホスティングサービスをお探しなら、Kinstaのホスティングプランをぜひご検討ください。

Steve Bonisteel Kinsta

Steve Bonisteel is a Technical Editor at Kinsta who began his writing career as a print journalist, chasing ambulances and fire trucks. He has been covering Internet-related technology since the late 1990s.