⚡ 30 秒速记
- 核心判断：一次请求跨越地址解析、连接协商、缓存决策、服务端处理和浏览器消费，多层状态共同决定结果
- 原理主线：围绕 「一、请求响应头中关于缓存的奥秘」、「二、网页由慢到快背后的强缓存」、「三、缓存新鲜度与使用期算法」 建立输入、状态变化与输出之间的因果关系
- 文章范围：系统梳理了前端缓存的核心原理与实现方式，详细解析了 HTTP 缓存机制、请求与响应头中的缓存相关字段、强缓存与协商缓存的区别及应用场景，并结合实际案例讲解如何优化前端性能，帮助开发者全面掌握前端缓存策略与最佳实践。
- 边界与代价：缓存命中、连接复用、代理和协议版本会改变实际链路，状态码相同也可能走过完全不同路径
- 工程落地：排障应把 DNS、连接、请求、TTFB、下载和渲染分段测量，并结合响应头验证推断
前端缓存本质上是浏览器先判断资源是否仍然新鲜，能直接复用就命中强缓存，否则再向服务器确认是否需要更新。 强缓存主要看 Cache-Control 和 Expires，其中 max-age 优先于绝对时间形式的 Expires，可避免单纯依赖客户端时间。协商缓存通过 ETag、If-None-Match 或修改时间进行验证，资源未变化时服务器返回 304。配置时要分清 no-cache 是每次使用前验证，no-store 才是不存储，同时代理缓存还要考虑 s-maxage、public 与 private。
这篇文章不要按 API 清单来背。先用上面的 Mind Map 建立全局结构，再通过交互 DEMO 观察正常路径和边界路径如何改变状态；阅读正文时重点核对每一步的输入、负责执行的参与者、产生的中间状态以及最终可观察结果。遇到版本敏感结论，要把“历史实现”“当前行为”和“工程兼容策略”分开说明；遇到性能或架构取舍，则用实际指标、失败现象和验证手段支撑判断。
版本校准： 原理文章中的代码代表特定实现与写作时间。应用到当前项目时，应先确认浏览器、框架或工具的主版本，再区分稳定的规范语义、可变化的内部实现和项目自身约束。
# 一、请求响应头中关于缓存的奥秘
# 从 HTTP 开始
首先我们了解下 HTTP 的概念：
超文本传输协议（Hyper Text Transfer Protocol，HTTP）是一个简单的请求-响应协议，它通常运行在TCP之上。它指定了客户端可能发送给服务器什么样的消息以及得到什么样的响应。
以上我们不难发现 HTTP 是一种超文本传输协议，HTTP 协议用于客户端和服务端之间的通信（通过请求和响应的交换达成通信），请求必定由客户端发出，而服务端回复响应。
HTTP 请求部分又可以称为前端工程师眼中的 HTTP，它主要发生在客户端，请求是由“报文”的形式发送的，请求报文由三部分组成：请求行、请求报头和请求正文。同样 HTTP 响应部分的响应报文也由三部分组成：状态行、响应报头和响应正文。
