前端缓存相关

4 min read

前端缓存相关

浏览器缓存策略相关：比如Cache-Control、Pragma、ETag、Expires、Last-Modified

强缓存是利用Expires或者Cache-Control这两个http header实现的，命中缓存会返回200

  • 强缓存是不会产生 DNS 解析的，更不会发送请求（不请求服务器）
  • expires 有 服务器时间 和 客户端时间 不一致导致失效的问题

协商缓存利用Last-Modified或者Etag这两个http header实现，命中缓存会返回304

  • 协商缓存由服务器验证缓存的有效性（请求服务器）
  • Last-Modified 比较前一个响应头的
    • 根据时间来缓存
    • 最后修改只能精确到秒级
    • 定期生成文件内容没变化时 Last-Modified 改变
  • Etag

在文件变动的时候需要清除缓存。比如：在webpack打包的时候一般会给JS、CSS、图片的文件名添加chunkhash。