缓存的核心思想

缓存是性能优化中最有效、成本最低的手段之一。合理的缓存策略可以:

  • ✅ 减少网络带宽消耗
  • ✅ 降低服务器压力
  • ✅ 提升用户加载速度
  • ✅ 改善离线体验

缓存分类

1. 强缓存

状态码:200 (from memory/disk cache)

不需要向服务器发送请求,直接使用本地缓存。

响应头 说明 优先级
Cache-Control: max-age=3600 缓存有效期(秒) 最高
Expires: Wed, 21 Oct 2026 07:28:00 GMT 过期时间点 最低

2. 协商缓存

状态码:304 (Not Modified)

需要向服务器验证缓存是否有效。

验证字段 说明 精度
ETag / If-None-Match 文件哈希标识
Last-Modified / If-Modified-Since 文件修改时间

缓存决策流程

浏览器请求资源 → 检查本地缓存 → 缓存过期?
        ↓                     ↓
        否                    是
        ↓                     ↓
使用本地缓存          发起验证请求 → 资源未修改?
                              ↓
                        是          否
                        ↓            ↓
                    304 更新有效期  200 返回新资源

最佳实践配置

资源类型 Cache-Control配置 说明
HTML页面 no-cache 每次都校验
静态资源(js/css/img) max-age=31536000, immutable 永久缓存,通过文件名哈希更新
接口数据 max-age=60 短时间缓存
敏感数据 no-store 不缓存

常见误区

错误观点: 设置了max-age就永远不会发起请求

正确理解: 用户强制刷新、缓存被浏览器LRU淘汰都会导致重新请求

错误观点: 304响应完全没有开销

正确理解: 仍然有往返时间RTT开销,只是没有响应体传输


💡 思考

缓存的本质是在「数据新鲜度」和「性能」之间做权衡。没有完美的缓存策略,只有最适合业务场景的策略。

... 次阅读