STATUS IS UPウェブサイト最適化ウィキ
20高速化
パフォーマンスと配信 / 高速化

ウェブサイト所有者のためのブラウザキャッシュ ガイド

繰り返しの訪問で不要なダウンロードを避けつつ、訪問者を古いページや安全でない個人向けコンテンツに閉じ込めないよう、明確なHTTPキャッシュ規則を設定します。

ウェブサイト所有者のためのブラウザキャッシュ ガイド — ビジュアルガイド
読む
7 分
出典
6
再検証
2027-03-27
レビュー済み
ウェブパフォーマンス・リリースエンジニアリング レビューア
短い答え

まず決断から始める。

URLごとに異なるキャッシュルールを使ってください。URL上で内容が変わらないファイル(ハッシュ名のJavaScript、CSS、フォント、画像など)には長いFreshness lifetimeを付与します。HTMLやバージョン管理されていない応答には、Freshnessが重要な場合にブラウザが再利用前に検証する方針を与えてください。アセットが変更されたら常に新しいアセットURLを公開してください。長いキャッシュ寿命は、まだfreshなコピーに対して信頼できる形で元に戻すことはできません。

ステージング環境でヘッダーとブラウザの動作を検証してから運用に反映してください。まず明示的なCache-Controlヘッダーを設定し、次にETagや可能ならLast-Modifiedと組み合わせて検証に優しい応答を用意します。個人化、アカウント、チェックアウト、機密レスポンスは公開ページと別扱いにしてください。SIUはこれをプロアクティブなアップタイム最適化として扱います:不要なオリジン作業を減らし、キャッシュ関連のリリース不具合が使えるサイトを妨げる前に防ぎます。

ビジュアルガイド

作業をシステムとして見る。

個別の戦術に取り掛かる前に、この記事の意思決定をこのマップで結び付けてください。

SIU高速化
01リソースごとに方針を割り当てる(サーバー単位ではない)
02Cache-Control用語を正確に使う
03イミュータブル(不変)アセットは長い寿命を付与する前にバージョン化する
04HTMLは長期キャッシュにするのではなく検証で新鮮にする
01

リソースごとに方針を割り当てる(サーバー単位ではない)

ヘッダーを変更する前に代表的なURLのインベントリを作成してください:ホーム、コンテンツページ、アプリケーションシェル、CSS、JavaScript、画像、フォント、API、ログイン、アカウント、チェックアウト、ダウンロードなど。各URLについて、レスポンスが公開か個人化か、バイトが変わるとURLが変わるか、修正がどれだけ迅速に訪問者に届くべきかを記録します。

そのインベントリから方針マトリクスを作成します。公開のコンテンツアドレス化されたアセットは、安定したアドレスのHTMLとは異なるルールが必要です。Cache-Controlがないレスポンスであってもヒューリスティックにキャッシュされることがあるため、明示的なルールの方がテストしやすいです。

Freshness lifetime

保存された応答が再利用できる期間。max-ageで秒単位に指定します。

02

Cache-Control用語を正確に使う

Cache-Controlはブラウザや共有キャッシュに対してレスポンスの保管と再利用方法を伝えます。max-age=Nはfreshな間は再利用を許可します。s-maxage=Nは共有キャッシュのfreshnessを設定してそこではmax-ageをオーバーライドします(ブラウザはs-maxageを無視します)。publicは任意のキャッシュを許可し、privateはブラウザキャッシュを許可するが共有キャッシュでの保管を防ぎます。

no-cacheは保存を許容しますが再利用前にオリジンでの検証を要求します。no-storeはキャッシュに保存してはならないことを意味しますが、完全なプライバシー制御ではありません。must-revalidateは期限切れ後に古いコンテンツを出すことが許容されない場合に使用します;この指定があるとオリジンが利用不可のときにキャッシュは504を返すことがあり、古いフォールバックを返すことを防げます。

包括的な no-store の回避

no-store は保存を取り除くだけで単にチェックを要求するわけではありません。保存してはならない本当に機密なレスポンスに限定して使ってください。

03

イミュータブル(不変)アセットは長い寿命を付与する前にバージョン化する

バージョン付きアセットURLはコンテンツフィンガープリントやリリースバージョンを含みます(例:app.4f2c.js)。アセットのバイトが変わったら別のURLを公開し、HTMLの参照を更新します。キャッシュから見ると新しいリソースになるため、無効化がすべてのブラウザに届かなくても訪問者は新しいアセットを取得します。

表現がそのFreshness lifetimeの間に変わらないと分かる場合、Cache-Control: max-age=31536000, immutable のようなパターンが実用的です。immutableは対応するクライアントに対してfreshな間の条件付き再検証を行わないよう指示します。同じURLで変更されうる可変ファイルに対して年単位のmax-ageやimmutableを適用してはいけません。キャッシュされたHTMLがそれらを参照し続ける可能性がある間は、以前のフィンガープリント済みアセットを保持してください。

HTMLはマニフェストである

HTMLがアセットURLを選ぶため、リリースの順序付けは参照される世代を保持する必要があります。

04

HTMLは長期キャッシュにするのではなく検証で新鮮にする

HTMLは通常、人間が見る安定したURLを持ち、コンテンツ、アセット参照、機能フラグ、セキュリティ通知で変わります。保守的な公開HTMLパターンは Cache-Control: no-cache と ETag と Last-Modified を組み合わせることです(プラットフォームが正しく生成できる場合)。ブラウザはボディを保存しますが再利用前に条件付きリクエストを行い、未変更ならば 304 Not Modified をボディなしで受け取ります。

ETagはリソースのバージョンを識別します。古くなった応答ではブラウザはそれを If-None-Match に入れて送信できます;一致すればサーバは 304 を返し、一致しなければ新しい表現を返します。RFCは可能であれば200レスポンスにETagとLast-Modifiedの両方を付与することを推奨しています。no-cacheはBackやForwardのナビゲーションで必ず検証を行うことを保証するものではありません(ブラウザがセッション履歴のスナップショットを復元することがあるため)。

バリデータの品質

ETagは表現が変わったときに必ず変わらなければなりません;オリジンやデプロイを跨いでテストしてください。

05

公開配信と個人化・機密レスポンスを分離する

CDNのような共有キャッシュは1つのレスポンスを複数ユーザーで再利用する可能性があります。アカウント固有のHTMLやAPIデータを誤ってユーザー間で再利用させないでください。ブラウザに残り得る個人化コンテンツについては、private, no-cache が出発点として合理的です:共有保管を防ぎ、検証を要求します。Set-Cookie ヘッダーだけではキャッシュを止められません。

保存してはならないレスポンスについては no-store を使い、アプリケーションコード、CDNルール、Service Worker、ブラウザストレージ、ログ、エラーページを確認してください。ヘッダーだけでプライバシー、コンプライアンス、決済セキュリティ要件が満たされるわけではありません。機密フローについては資格あるセキュリティ、プライバシー、決済のレビュワーに評価してもらってください。

認可の変化

サインイン、サインアウト、アカウント切替、権限変更をウォームなブラウザとCDNキャッシュでテストしてください。

06

キャッシュ変更は取り消し可能なリリースとして展開する

未キャッシュおよび再訪リクエストのベースラインヘッダーとボディの挙動をキャプチャしてください。ステージングでは、まずバージョン化アセットをデプロイし、その後それらを参照するHTMLをデプロイし、古いキャッシュされたHTMLが新しいオリジンに対してどう振る舞うかをテストします。オリジン直結パスとCDN経路の両方がある場合は両方を確認してください。DevToolsのNetworkパネルで意図した方針と再訪挙動が表示されるはずです。

リリースマニフェストにアセットURL、ヘッダールール、設定バージョンを記録してください。もしリリースが互換性のないクライアントファイルを組み合わせてしまった場合は、互換性のあるHTMLとアプリケーション挙動に戻しますが、公開済みのフィンガープリント済みファイルを上書きしないでください。既知の良い世代にHTMLを向け直し、キャッシュされたHTMLがそれらを要求する間は両方の世代を保持します。共有キャッシュのパージはすべてのブラウザに新鮮なレスポンスの破棄を強制できません。

プロアクティブな是正措置

ヘッテストの失敗、アセット404、バージョン不一致を次のリリースチェックリストへの修正項目に変えてください。

実行 / 検証

実践的なTo‑Doガイド。

  1. 01

    レスポンスクラスのインベントリ作成

    サンプルURLを公開か個人化か、可変かバージョン化かで分類します。

    検証: HTML、アセット、API、認証、アカウント、チェックアウト、エラーを含むこと。
  2. 02

    現在のヘッダーを取得

    OriginとCDNの両方で Cache-Control、ETag、Last-Modified、Age、Vary、ステータスを記録します。

    検証: 変更前のスナップショットが各サンプルについて存在すること。
  3. 03

    可変アセットにフィンガープリントを付与

    ビルドがバイト変更時に新しいアセットURLを公開するようにします。

    検証: 変更されたアセットは変更されたURLとHTML参照を生成すること。
  4. 04

    明示的な方針を設定

    イミュータブルなバージョン化URLにのみ長期ルールを使い、安定URLには検証優先ルールを使ってください。

    検証: ヘッダーテストが意図した方針に一致すること。
  5. 05

    検証をテスト

    変更がない文書は条件付きリクエストで304を返し、変更があるものは新しいETagで200を返すことを確認します。

    検証: ステージングのトレースが両パスを示すこと。
  6. 06

    プライバシー境界を実行で検証

    2つのアカウント、サインアウト、ロール変更、機密ルートをウォームキャッシュでテストします。

    検証: 個人化されたレスポンスがユーザー間で漏れないこと。
  7. 07

    リリース互換性を証明

    次のリリース後にキャッシュされた旧HTMLをロードしてみます。

    検証: 旧・現行HTMLが参照するアセットを404やスクリプトエラーなく読み込むこと。
  8. 08

    ロールバックを文書化

    良好世代、ヘッダーバージョン、所有者、古いアセット保持期間を記録します。

    検証: 非本番ドリルで既知の良好世代を不変URLを編集せずに復元できること。
議論のテーマ

トレードオフを比較し、非公開データは共有しないでください。

これらのプロンプトをチームやサイトオーナーコミュニティで使ってください。手法や学びは共有して構いませんが、認証情報や顧客データ、非公開インフラの詳細を貼り付けないでください。

  1. 01

    あなたのサイトで、公開・個人化・不変・頻繁に変わるのどのURLクラスが分類しにくいか、そしてその決定をどのように文書化していますか?

  2. 02

    訪問者が古いHTMLと新しいアセットの不一致に遭遇する前に検出するのに最も有効だったリリース順序テストは何ですか?

  3. 03

    CDN、アプリケーション、ブラウザキャッシュのルールはどこで重なり合い、結合された挙動が意図した方針と一致していることの検証は誰が担っていますか?

人気/信頼できる資料

出典資料を開く。

IETFRFC 9111: HTTP Caching ↗

freshness、validation、キャッシュディレクティブ、無効化、機密情報の限界を説明します。

レビュー日 2026-09-27
IETFRFC 8246: HTTP Immutable Responses ↗

immutableキャッシングの定義、適用範囲、破損に関する考慮事項を示します。

レビュー日 2026-09-27
MDN Web DocsHTTP caching ↗

バリデータ、304、パーソナライズ、キャッシュバスティングに関する実践的ガイダンスです。

レビュー日 2026-09-27
MDN Web DocsCache-Control header ↗

max-age、s-maxage、no-cache、no-store、private、public、must-revalidateのリファレンスです。

レビュー日 2026-09-27
MDN Web DocsETag header ↗

エンティティタグ、If-None-Match、304検証の解説です。

レビュー日 2026-09-27
web.devPrevent unnecessary network requests with the HTTP Cache ↗

バージョン化URL、バリデータ、方針、デプロイに関する実務的ガイダンスです。

レビュー日 2026-09-27

出典ポリシー 本記事は既知の標準と一次の技術ドキュメントを参照しています。根拠のない性能主張を避け、HTTPルールとプラットフォーム固有の設定を切り分けて記述しています。

簡単な補足

よくある質問

no-cache はブラウザがページを保存できないことを意味しますか?

いいえ。no-cache は保存を許容しますが、再利用前にオリジンでの成功した検証を要求します。レスポンスを保存してはならない場合のみ no-store を使ってください。ただし no-store 単体が完全なプライバシー保証になるわけではないことを認識してください。

すべての静的ファイルに1年のキャッシュ寿命を付与すべきですか?

いいえ。1年の max-age は、その期間中にURLのバイトが変わらない場合(通常はURLがフィンガープリント化またはバージョン化されている場合)にのみ適切です。同じURLで可変のファイルには短い寿命か検証優先の方針が必要です。

CDNのパージでブラウザのキャッシュミスを修正できますか?

共有キャッシュのコピーは削除できますが、すべてのブラウザに対してfreshなレスポンスを破棄することはできません。新しいバージョン化アセットURLを公開してHTML参照を更新し、それでも問題が起きた場合はロールバック計画で互換性のある世代に戻してください。

Status Is UP Editorial Team · アップタイム有効化編集者

レビュー: ウェブパフォーマンス・リリースエンジニアリング レビューア。公開 2026-09-27、更新 2026-09-30。