Chromeのブラウザキャッシュ
Recent posts

以下のエントリのメモ。

https://blog.jxck.io/entries/2023-11-05/reload-and-cache.html

Navigation（ex: Aタグ踏んだ時）

  • ブラウザがEtagやLast-Modifiedが付与してリクエスト送信
  • 304が返ると再利用される
GET / HTTP/1.1
Host: example.com

If-None-Match: "deadbeef"
If-Modified-Since: Thu, 20 Feb 2020 20:20:20 GMT

Reload（ex. リロードボタン）

  • 最新の情報を得るためのユーザーアクション
  • ブラウザは最新のHTMLをOriginにリクエストする
  • 304が返ると再利用される
GET / HTTP/1.1
Host: example.com

Cache-Control: max-age=0
If-None-Match: "deadbeef"
If-Modified-Since: Thu, 20 Feb 2020 20:20:20 GMT

リクエストは上記になるため、max-ageが切れていなくてもValidationが強制される。

Force Reload（ex. 開発者用のリロード）

  • 厳密なリロードを求める開発者のアクション
  • ブラウザはno-cacheでリクエストする
  • 仕組み的に304が返ることがないみたい
GET / HTTP/1.1
Host: example.com

Cache-Control: no-cache

昔から存在するmax-ageに加えて、より厳密なリロードであるno-cacheの実装が求められるようになった。ブラウザはDisable Cacheの機能を実装し、開発者がno-cacheをリクエストできるようにした。

Validation

If-Modified-SinceやLast-Modifiedを付与したリクエストは「Conditional Request」と呼び、サーバーにキャッシュ有効無効のValidationを強制する。