缓存
缓存控制是网站性能优化中至为常见及重要的一环,好的缓存控制,除了使网站在性能方面有所提升,在财务方面也有重要提升: 更好的缓存策略意味着更少的请求,更少的流量,更少的峰值带宽,从而节省一大笔服务器或者 CDN 的费用。
缓存控制策略就是 http caching 的策略,化繁为简,最有效的策略往往是很简单的。在最简单的粗略下,你对 http cache 只需要了解一个 Cache-Control 的头部。
一个较好的缓存策略只需要两部分,而它们只需要通过 Cache-Control 控制:
- 带指纹资源: 永久缓存
- 非带指纹资源: 每次进行新鲜度校验
带指纹资源: 永久缓存
Cache-Control: public,max-age=31536000,immutable
天下武功,无坚不摧,唯快不破。资源请求最快的方式就是不向服务器发起请求,通过以上响应头可以对资源设置永久缓存。
静态资源带有 hash 值,即指纹 对资源设置一年过期时间,即 31536000,一般认为是永久缓存 在永久缓存期间浏览器不需要向服务器发送请求 那为什么带有 hash 值的资源可以永久缓存呢?
因为该文件的内容发生变化时,会生成一个带有新的 hash 值的 URL。 前端将会发起一个新的 URL 的请求。
非带指纹资源: 每次进行新鲜度校验
Cache-Control: no-cache
Etag: helloshanyue
由于不带有指纹,每次都需要校验资源的新鲜度。(从缓存中取到资源,可能是过期资源) 如果校验为最新资源,则从浏览器的缓存中加载资源 index.html 为不带有指纹资源,如果把它置于缓存中,则如何保证服务器刷新数据时,被浏览器可以获取到新鲜的资源?
因此,使用 Cache-Control: no-cache 时,客户端每次对服务器进行新鲜度校验。
即使每次校验新鲜度,也不需要每次都从服务器下载资源: 如果浏览器/CDN 上缓存经校验没有过期。这被称为协商缓存,此时 http 状态码返回 304,指 Not Modified,即没有变更。