世界中のユーザーを対象に運営するウェブサイトでは、読み込み時間が長くレイテンシが大きいと、ユーザー体験を損なう可能性があります。個人ブログ、ECサイト、アプリケーション、どのようなサイトにとっても速度と応答性はユーザー体験を左右します。
コンテンツに関心を持ったユーザーが、画面の前で辛抱強く読み込みを待ってくれるとは限りません。したがって、優れたユーザー体験は非常に重要です。
幸い、サイトのパフォーマンスを改善するのに役立つツールは多数あります。今回取り上げるエッジキャッシュは、最も効果的なソリューションの一つです。
WordPressサイトの読み込み時間の長さや反応の悪さに苛立っている方は、この記事は必読です。エッジキャッシュを活用し、WordPressサイトを改善する方法を詳しくご紹介していきます。
エッジキャッシュとは
まずはエッジキャッシュの「エッジ」とは一体何か、サイトのパフォーマンスにどのような影響を与えるのかをご説明します。
エッジコンピューティングとは、クライアント（サイト訪問者）とオリジンサーバー（サイトがホストされている場所）の間の物理的な距離を縮めてくれるネットワーク技法です。
多くのCDNでは、これを実現するためにエッジサーバーを採用しています。CDNは世界中に集中型のデータセンターを分散させることで機能していますが、そのデータセンターの多くはユーザーから物理的に離れた場所に設置されています。
「エッジ」とは、CDNの外周、またはエンドユーザーに最も近いネットワークインフラを意味し、この距離を縮めるためにエッジサーバーが置かれています。エッジサーバーは通常、ISPとCDNが接続する物理的なインターネットエクスチェンジポイント（IXP）に設置されます。
エッジキャッシュは、広大なネットワークの架け橋を利用して、サイトのコンテンツのコピーを訪問者の近くに保存し、オリジンサーバーからのデータ取得にかかる時間を短縮する強力な技術です。
エッジキャッシュの仕組み
ユーザーがサイトから画像、動画、ウェブページなどのコンテンツをリクエストすると、リクエストは通常、オリジンサーバーに直接送信されるのではなく、最も近いエッジサーバーにルーティングされます。
エッジキャッシュは、静的および動的コンテンツをエッジサーバーに保存することで機能します。画像、CSSファイル、JavaScriptなどの静的コンテンツは、変更されないことから長期間キャッシュすることができます。動的コンテンツの場合は、頻繁に更新される可能性が高く、より高度なキャッシュ戦略が求められます。
コンテンツをエッジサーバーにキャッシュすることで、その後のリクエストは、オリジンサーバーからではなく、エッジサーバーから直接配信することができます。
これにより、サーバーの負荷が軽減されるだけでなく、データの移動距離も最小限に抑えられるため、読み込みが高速に。待ち時間も短縮され、結果として全体的なパフォーマンス改善が期待できます。
エッジキャッシュは、世界中のユーザーを対象にサイトを提供している場合に特に有益です。CDNの広く分散したエッジサーバーを活用することで、世界中のユーザーが素早くコンテンツにアクセスすることができます。
エッジキャッシュが有益なサイト
エッジキャッシュは、シンプルな静的サイトから高度にインタラクティブアプリケーションまで、さまざまなウェブサイトに有効です。以下、エッジキャッシュがパフォーマンスの大幅改善に役立つサイトの種類をいくつか具体的に見てみましょう。
静的サイト
まずエッジキャッシュは、ほとんど変更のない固定コンテンツで構成される静的サイトに適しています。
このようなサイトには通常、動的コンテンツを持たないブログ、ポートフォリオ、ランディングページ、情報サイトなどが該当し、HTML、CSS、画像などのアセット、JavaScriptなどのクライアント側スクリプトで構成されています。
エッジキャッシュは、一部の動的コンテンツには有用ですが、特別な設定が必要になります。静的サイトのプリレンダリングは、キャッシュファイルが数週間から数ヶ月にわたって最新の状態に保たれるため、エッジキャッシュとは相性抜群です。
オリジンサーバーから変更されていないコンテンツを繰り返し取得する必要がなくなるため、キャッシュされたリソースにすぐにアクセスでき、よりブラウジングがスムーズになります。
さらに、静的サイトはサーバーの負荷が少なく帯域幅もほとんど消費しないため、サーバーサイドのスクリプトを多用したり、データベースを頻繁に呼び出したりするサイトと比べて、キャッシュと配信がはるかに速く、費用対効果も高くなります。
インタラクティブなアプリケーション
ECプラットフォームやSNSプラットフォームなど、インタラクティブなアプリケーションに大きく依存したり、動的コンテンツを配信したりするサイトでは、エッジキャッシュがパフォーマンス最適化の大きな鍵となります。
従来のキャッシュは、動的コンテンツやパーソナライズされたコンテンツに対しては、あまり効果がないのが一般的で、長年、画像やHTMLのような静的コンテンツしかキャッシュすることができませんでした。
ところが、エッジキャッシュの登場によって、スクリプトそのものをCDNのエッジサーバーからデプロイすることができるように。
その一例が、Cloudflare Workersです。CloudflareのCDN上で実行されるJavascript関数で、ユーザーの入力に反応する動的なコードをエッジサーバー上で実行し、世界中のユーザーに即座に届けることができます。
これにより、インタラクティブ性を維持したまま、訪問者にシームレスな体験を提供することができます。
リクエストが多くリソースを消費するサイト
配信プラットフォームやオンラインゲームポータルなど、大量のトラフィックやリソースを必要とするアプリケーションを扱うサイトもまた、エッジキャッシュから大きな恩恵を受けることができます。
これらのサイトでは、動画、オーディオストリーム、高解像度画像などの大容量ファイルを提供する傾向にあり、オリジンサーバーやネットワーク帯域幅に負担がかかり、バッファリングやレイテンシが発生する可能性があります。
エッジキャッシュは、訪問者に最も近いエッジサーバーからこれらの大容量ファイルを保存して提供することで、サーバーの負担を軽減します。さらに、分散型という特徴から、大規模なトラフィックの急増にも対応でき、訪問者数の増加に応じて拡張することができます。
ECサイト
ECサイトでは、わずかな遅延が潜在顧客獲得の分かれ目に。1秒たりとも無駄にすることができません。
エッジキャッシュは、商品リスト、価格情報、ユーザーセッションなど、高速で信頼性に優れた配信を必要とする動的コンテンツをキャッシュすることで、ECサイトを支えます。また、頻繁にアクセスされる商品ページ、画像などのリソースをエッジサーバーにキャッシュします。
残念ながら、ECサイトはしばしばDDoS攻撃の標的となり、壊滅的な打撃を受けるリスクに晒されています。エッジサーバーとCDNを使用すれば、ロードバランシング技術によって悪意のあるトラフィックの波を何百ものサーバーに分散し、買い物中の顧客のユーザー体験を高めることができます。
さらに、大事なセール期間中のトラフィック急増にも難なく対応できるように。
小規模なオンラインストアでも、巨大なマーケットプレイスでも、エッジキャッシュでシームレスかつ安全なショッピング体験を実現できます。
メディア配信サイト
ライブ配信、動画配信、音楽配信などは、いずれもサーバーに高負荷がかかります。
再生中の曲や動画がバッファリングにより一時停止してしまう苛立たしさは、誰もが経験したことがあるはず。一般的なサイトならある程度のレイテンシは許容できても、メディア配信プラットフォームとなれば話は別です。
スムーズで中断することのない配信を実現するには、エッジキャッシュが欠かせません。動画や音声ファイルは頻繁に変更されるものではないため、訪問者に近いエッジサーバーにキャッシュすることができます。高解像度の動画を配信する場合、負荷が高くネットワークの混雑が大きな問題となるため、これが特に重要です。
エッジキャッシュは、ライブ配信にも有益です。リアルタイムのコンテンツをキャッシュするのは難しい可能性がありますが、世界中のユーザーに近いエッジサーバーにそれぞれ接続できるため、視聴者が数千人に急増しても、オリジンサーバーに負担がかかりません。
メディア配信サイトは、エッジキャッシュを利用することで、視聴者が何度も訪れたくなるような、プレミアムな視聴体験を提供することができます。
ゲームプラットフォーム
メディア配信サイトと同様、オンラインゲームにも遅延が許されません。レイテンシが大きく反応が鈍いゲームは、ユーザーはすぐに離れてしまいます。
これは特にマルチプレイヤーゲームで顕著で、ちょっとした不備がユーザーの楽しみを大きく損ないます。
ゲームを最適化し、不必要なネットワーク呼び出しが発生しないようにする責任は、ある程度は開発者に帰属しますが、エッジサーバーを多数持つCDNを使用することも同等に重要です。
エッジサーバーは、グラフィックや音声ファイルのようなアセットをキャッシュし、プレーヤーの到達時に配信するために使用できます。また、今後のアップデートファイルや、場合によってはゲームファイル全体をキャッシュすることも可能です。
さらに、ゲームサーバーはDDoS攻撃の標的になりがちですが、エッジキャッシュによって悪意のあるトラフィックをオフロードすることもできます。
オンライン学習プラットフォーム
学習管理システムなどの教育用サイトには、キャッシュ可能なコンテンツが多数あります。
画像、動画、音声、インタラクティブなゲームやデモンストレーション、ライブ配信、クイズなど、インタラクティブな教材をすべてキャッシュすることができ、効率的に生徒に配信することができます。
世界中のエッジサーバーへの配信は、生徒の登録数が多いサイトにも非常に便利です。低速でパフォーマンスの悪いLMSは、利用者の学習に悪影響を与えます。
ブログ、ニュース、情報サイト
ブログや情報サイトも、静的コンテンツを多く使用しているため、エッジキャッシュとの相性は良好です。記事などを更新するにしても、そこまで頻度は高くないため、ある程度の期間はキャッシュすることができます。
頻繁にアクセスされる記事、画像、マルチメディアをユーザーに近いエッジサーバーにキャッシュすることで、ブログの表示速度が速くなり、全体的な応答性が向上。これにより、読者は中断や遅延なく記事を閲覧することができます。
ブログは世界中で閲覧されるものです。トラフィック急増時にも世界中からのアクセスに対応するためにも、エッジキャッシュは活用したいところ。ブログ記事の順位は、いつ急上昇するかわかりません。
エッジキャッシュが不要なサイト
エッジキャッシュには、サイトパフォーマンスの最適化にまつわる多数の利点がありますが、その一方であまり役に立たない場合もあります。
動的またはリアルタイム性の高いコンテンツ
エッジキャッシュは、静的コンテンツや一部の動的コンテンツの配信を最適化してくれますが、高度に動的なコンテンツ、特にリアルタイムで変化するコンテンツのキャッシュには限界があります。
頻繁に更新されるコンテンツや、ユーザーごとにパーソナライズされたコンテンツは、適さない可能性があります。
Cloudflareなどの最新のCDNは、エッジサーバーからコードを実行するなど、特定のタイプの動的コンテンツをより効果的に処理できる機能が導入されていますが、それでもすべてをキャッシュできるわけではありません。実現するには、相当なスキルや高度な知識、複雑なCDNのセットアップが求められます。
キャッシュが実現不可能または実用的でない場合は、ブラウザキャッシュを活用し、ファイルサイズが小さくなるようにリソースを最適化し、より効率的なコードを実装してサーバーの応答時間を抑えることができます。
パーソナライズされたコンテンツ
エッジキャッシュは、個々のユーザーに応じたコンテンツの配信には適していません。キャッシュの主な利点は、頻繁にアクセスされるコンテンツをエッジサーバーから配信することで、世界中のユーザーが迅速に読み込めること。ユーザー1名しか閲覧しない場合は、キャッシュする意味がほとんどありません。
ECサイトのパーソナライズされたおすすめ商品、カスタマイズされたニュースフィード、ユーザー固有のダッシュボードなどは、リアルタイムのデータやインタラクションに依存するため、基本的にキャッシュすることはできません。
代わりに、クライアントサイドスクリプト、ブラウザキャッシュ、コンテンツのプリフェッチ、データ圧縮など、動的コンテンツの配信戦略を実行して最適化することができます。
複雑なキャッシュルール
エッジキャッシュを実装すると、特にサイトに複雑なキャッシュルールがすでに設定されている場合、さらに複雑さが増す可能性があります。
例えば、独自のCache-Controlヘッダー、キャッシュの無効化、キャッシュバイパスルールなどの既存のルールと合わせると、設定が難しくなり、予測しない結果を引き起こすことがあります。
エッジキャッシュの活用が不可能というわけではありませんが、正しく設定するには熟練した開発者の協力が必要になります。オリジンサーバーとエッジサーバーのキャッシュ設定が一致しなければ、キャッシュが競合したり、古いコンテンツが表示されたりする恐れがあります。
既存のキャッシュアーキテクチャの複雑さにもよりますが、エッジキャッシュの導入は大掛かりな作業になります。
大容量ファイル
エッジキャッシュは通常、小規模から中規模の静的ファイルの配信に最適化されています。サーバーの容量によっては、高解像度の動画、ソフトウェアのダウンロード、大規模なデータセットなど、巨大なファイルをキャッシュすることが難しい場合があります。
これは、使用するCDNによって異なります。エッジサーバーが大容量のメディアファイルの配信に手間取ると、重要なサイトファイルがキャッシュから削除されたり、何百人ものユーザーに大容量のファイルを配信することで高い帯域幅とリソースを消費し、パフォーマンスが低下したりする可能性があります。
ファイルが頻繁に更新される場合、すべてのエッジサーバーで古いバージョンをパージして更新する必要があるため、キャッシュ無効化の問題も発生します。これには時間がかかることがあるため、ユーザーに古いコンテンツが表示されることも。
代わりに、ユーザーがエッジキャッシュを回避してオリジンサーバーからダウンロードするようにしたり、コンテンツを部分的にキャッシュしたり、動画配信やCDNが必要なサイトでは、大容量ファイルの配信に最適化された専用のCDN設定を作成したりするのがお勧めです。
セキュリティとプライバシーの問題
エッジキャッシュは、サイトのパフォーマンスを向上させますが、特に認証された、ユーザー認証型で、パーソナライズされた個別のコンテンツをキャッシュする場合、潜在的なセキュリティとプライバシーの問題を引き起こします。
機密情報をエッジでキャッシュすると、不正アクセスやデータ漏洩のリスクが高まります。そしてコピーが多ければ多いほど、悪意あるユーザー見つかる可能性が高くなります。
また、コンテンツのキャッシュは、GDPRのような法令に反することも。GDPRは、要求に応じて保存されているユーザー情報のコピーを削除することを義務付けています。
エッジサーバーは、サイトとそのデータの攻撃対象を増やし、キャッシュポイズニングのようなセキュリティの脆弱性につながる可能性があります。
これについては、キャッシュを通過するすべての機密情報を暗号化し、キャッシュ無効化ポリシーを追加して古いデータや未使用のデータをパージ、あるいは機密情報をキャッシュしないことが対策となります。
その他の考慮事項
Kinstaをご利用の場合、以下のような特定の設定との互換性に関して、いくつか懸念点があります。
- 国全体を対象とする場合を除き、ジオロケーションと互換性がありません。州や都市に基づいたジオロケーションは正しくキャッシュされず、国境付近のエリアでは正しく動作しないことがあります。
- サイトキャッシュで特別に設定された除外項目は考慮されません。
- モバイル用またはPC用に異なるサイトを表示するためにユーザーエージェントを検出することができません。代替としてKinstaのモバイルキャッシュ機能を使用することができます。
- MyKinstaのパスワード保護と互換性がありません。
- Cloudflareの自動プラットフォーム最適化（APO）と互換性がありません。
- IPブロックおよびジオブロッキングと互換性がありません。
エッジキャッシュは、サイトのインフラストラクチャを問わず、特定の設定と競合する可能性があります。CDNを設定したり、エッジキャッシュを有効にしたりした後は、サイトとそのアプリケーションをテストし、すべてが正しく動作することを確認してください。
WordPressでのエッジキャッシュの仕組み
WordPress環境にエッジキャッシュを実装する場合、以下のような確認事項および課題があります。
- WordPressサイトは通常、静的アセットと、小さなサーバーサイドのスクリプトやデータベース呼び出しのような動的なコンテンツを提供します。この動的で常に更新される性質は、コンテンツが時に陳腐化する可能性があることを意味し、古いコンテンツの提供を避けるには、Cloudflare APOやキャッシュ無効化のようなパージメカニズムが必要になります。Kinstaのお客様は、問題があれば手動でエッジキャッシュをクリアすることができます。
- WordPressのプラグインやテーマが複雑な問題を引き起こす可能性も。動的コンテンツを生成したり、パーソナライズされたコンテンツや認証されたコンテンツを追加したり、サーバーサイドの処理に依存する一部のプラグインは、エッジキャッシュと互換性がない可能性があります。
WordPressサイトにエッジキャッシュを導入し、パフォーマンスを改善することは可能ですが、上記の考慮事項を念頭に置いて、動的コンテンツを追加するプラグインやテーマを広範囲にテストすることが重要です。
Kinstaのエッジキャッシュ
Kinstaでは、以下のような機能を特徴とするエッジキャッシュを追加料金なしで提供しています。
- Cloudflareおよび同社260箇所以上のデータセンターと統合し、すべてのプランにエッジキャッシュが無料で付帯。MyKinstaからワンクリックで利用可能。
- モバイルユーザー向けに個別のページを作成する場合は、モバイルキャッシュも利用できる。
- キャッシュをクリアする必要がある古いアセットがある場合は、オンデマンドでクリア可能（ページを更新するたびに自動的にクリアされるため、通常この操作は不要）。
- WooCommerceのカート、BuddyPressのユーザーごとのプロフィールエリア、またはログインが必要になるパーソナライズされたページは自動的に除外される（設定によりさらに多くのページを除外する必要がある場合は、カスタマーサポートが設定をサポート）。
なお、Kinstaのエッジキャッシュでは、画像やCSSファイルのような静的アセットは配信されません。静的アセットはKinstaのCDNによって処理されます。
Kinstaでのエッジキャッシュは非常にシンプル。無料で利用できるだけでなく、ボタンをクリックするだけで簡単に有効化することができます。面倒な設定やプラグインは不要です。
エッジキャッシュを使用する
エッジキャッシュの重要性をご紹介したところで、最後にサイトでエッジキャッシュを使用する方法を二通りご紹介します。
MyKinstaでエッジキャッシュを有効にする
MyKinstaでエッジキャッシュを有効にする場合は、トグルスイッチをクリックするだけでOKです。
- MyKinstaにログインし、「WordPressサイト」を開いて、エッジキャッシュを使用したいサイトを選択。
- 左サイドバーから「エッジキャッシュ」を選択。
- すべてのサイトに対してエッジキャッシュを提供しているため、すでに有効になっている場合も。そうでない場合は、「利用する」をクリック。
- カスタムキャッシュルールを実装している場合は、エッジキャッシュで動作することを確認するプロンプトが表示される。確認し準備が整ったら、「エッジキャッシュを有効にする」をクリック。
- モバイルユーザーを別ページに移動させる場合は、「モバイルキャッシュ」セクションの「利用する」もクリック。
以上で完了です。
エッジキャッシュは手動でクリアすることも可能です。同じ画面の「キャッシュのクリア」セクションの「キャッシュをクリアする」をクリックするか、その下のセクションに特定のURLを貼り付けて、「URL指定しキャッシュをクリア」をクリックしてください。
Cloudflareでエッジキャッシュを有効にする
KinstaのエッジキャッシュはCloudflare統合によるものであるため、Kinstaのお客様は以下の操作は不要です。
Cloudflareもデフォルトでエッジキャッシュを提供しており、バイパスルールを使用して特定のコンテンツをパージすることができます。また、エッジキャッシュのTTL（エッジサーバーがファイルを保存する期間）など、調整可能な設定もいくつかあります。
なお、すでにCache-Controlヘッダーを設定されている場合は、以下の設定が不要になる可能性もあります。また、キャッシュの設定は非常にきめ細かく、自分で扱うことが不安な場合は、経験豊富な開発者に相談することをお勧めします。
- Cloudflareアカウントにログインし、ダッシュボードを開く。
- 「ルール」＞「ページ ルール」を選択し、「ページ ルールを作成」をクリック。
- 「URL (必須)」フィールドにエッジキャッシュを使用したいページのURLを貼り付ける。複数のページに適用するには、ワイルドカード（*）記号を使用。たとえば「example.com/*」とすると、サイト上のすべてのページに適用される。なお、すべてのページがキャッシュに適しているわけではないため要注意。
- 「設定を選択する (必須)」ドロップダウンメニューで「エッジキャッシュ TTL」を選択し、有効期間を選択する。
- 動的アセットもキャッシュしたい場合は、「設定を追加」をクリックし、「キャッシュレベル」を選択して、「Cache Everything」に設定。
注）「Cache Everything」はログインが必要になるページには使用しないでください。ルールを作成して、機密性の高いページでは「Bypass」に設定してください。なおこの際、「Bypass」のルールは必ず「Cache Everything」のルール上にある必要があります。
あるいは、キャッシュルールを使用する手もあります。
- Cloudflareのダッシュボードを開く。
- 「Caching」＞「 Cache Rules」に移動し、「Create Rule」ボタンをクリック。
- ルールに名前を付け、「When incoming requests match …」を探す。「Field」ドロップダウンで「URI Path」をクリックし、「Operator」を「equal」のままにした状態で、「Value」に「/」を入力。これですべてのページにルールが適用されるようになるが、インフラによっては調整が必要。
- 「Edge TTL」をサイトに適した値に設定。手動で設定する場合は、「Ignore cache-control header and use this TTL」を選択。
- 設定を終えたら、「Deploy」をクリック。
まとめ
エッジキャッシュは、読み込み時間を短縮しより良いユーザー体験を実現し、結果としてWordPressサイトのパフォーマンスを最適化してくれる強力な技術です。静的アセットも動的アセットもエッジサーバーにキャッシュすることで、世界中のユーザーにコンテンツを高速配信することができます。
Kinstaなら、エッジキャッシングの使用と管理、そしてCDNとの統合はとても簡単です。Kinstaのエッジキャッシュの詳細はこちらをご覧ください。
コメントを残す