【エイチティーティーピーキャッシュ】

HTTPキャッシュ とは?

最終更新:
💡 取得済みの応答を、条件に応じて再利用する

ブラウザやプロキシがHTTPレスポンスを保存し、条件に応じて再利用する仕組み。Cache-ControlやETagなどで保存・再利用・再検証を制御する。

📌 このページのポイント
HTTPキャッシュ:応答を再利用 ① 新鮮で、再利用条件を満たす ブラウザ 保存済み の応答 サーバーへの問い合わせを省ける ② ETagなどで再検証する場合 ブラウザ サーバー 条件付き要求 変更なし:304 → 保存済みの本文 変更あり:200 → 新しい本文 max-ageは鮮度の期間、保存保証ではない no-cacheは再検証、no-storeは保存しない
再利用条件を満たす場合と、検証用の情報で問い合わせる場合の比較です。キャッシュがない場合や検証用の情報がない場合は通常の取得が必要です。
ひよこ ひよこ
ブラウザのキャッシュって何を保存してるの?
ペンギン先生 ペンギン先生
HTML、CSS、画像などを取得したHTTPレスポンスを保存するよ。条件が合えば再利用でき、通信量や待ち時間を減らせる。ブラウザだけでなく、プロキシなどで複数の利用者向けに保存する共有キャッシュもあるんだ。
ひよこ ひよこ
max-age=3600なら、1時間は必ず使うの?
ペンギン先生 ペンギン先生
応答の経過時間が3600秒未満なら新鮮とみなす設定だよ。受け取ってから必ず1時間という意味でも、1時間保存を保証する意味でもない。no-cacheなど別の条件や、再読み込みの要求によって再検証することもあるよ。
ひよこ ひよこ
no-cacheとno-storeはどう違うの?
ペンギン先生 ペンギン先生
引数のないno-cacheは、保存はできるけれど、再利用前にサーバーへ再検証する指定。no-storeは、その応答をキャッシュに保存しない指定だよ。共有キャッシュへの保存を避けるprivateとも役割が違うんだ。
ひよこ ひよこ
古いキャッシュは毎回304が返るの?
ペンギン先生 ペンギン先生
ETagなどがあれば条件付きリクエストで再検証できるよ。変更がなければ304 Not Modifiedを受けて保存済みの本文を使い、変更があれば通常は200 OKで新しい本文を受け取る。検証用の情報がなければ、通常の取得が必要になるね。
ひよこ ひよこ
更新が反映されないのを防ぐには?
ペンギン先生 ペンギン先生
変更時にURLも変わるCSSやJSを長くキャッシュし、HTMLは再検証させる、という設計例があるよ。一律の正解ではなく、更新頻度や個人向けの内容かどうかに合わせて、保存先と再利用条件を決めよう。
ペンギン
まとめ:ざっくりこれだけ覚えればOK!
「HTTPキャッシュ」って出てきたら「取得済みの応答を保存し、条件に応じて再利用する仕組み」と思えばだいたいOK!
📖 おまけ:英語の意味
「HTTP Cache」 = HTTP通信のキャッシュ
💬 Cache(貯蔵庫)にHTTPレスポンスを保存しておく仕組みで、Web高速化の基本中の基本だよ

参考資料

← 用語集にもどる