【浏览器篇】浏览器的缓存策略

通常浏览器缓存策略分为两种

  • 强缓存
    实现强缓存可以通过两种响应头实现,表示在缓存期间不需要请求,state code为200
    • Expires:HTTP/1.0的产物,表示在XX时间后过期,受限于本地时间
    • Cache-Control:HTTP/1.1,优先级高于Expires,值为max-age=xx,表示xx秒后过期
  • 协商缓存

    • Last-Modified和If-Modified-Since:Last-Modified表示本地文件最后修改日期,If-Modified-Since会将 Last-Modified的值发送给服务器,询问服务器在该日期后资源是否有更新,有更新的话就会将新的资源发送 回来。但是如果在本地打开缓存文件,就会造成Last-Modified被修改,所以在HTTP/1.1中出现了ETag。

    • ETag和If-None-Match:Etag类似于文件指纹,If-None-Match会将当前Etag发送给服务器,询问该资源ETag 是否有变动,有的话则将新的资源发送回来。优先级比Last-Modified高。

对于大部分的场景都可以使用强缓存配合协商缓存解决,但是在一些特殊的地方可能需要选择特殊的缓存策略

  • 对于某些不需要缓存的资源,可以使用Cache-Control: no-store
  • 对于频繁变动的资源,可以使用Cache-Control配合ETag使用
  • 对于代码文件来说,可以使用Cache-Control: max-age=3153600,并配合缓存策略使用,然后对文件进行指纹吹,一旦文件名变动就会下载新的文件
坚持原创技术分享,您的支持将鼓励我继续创作!