今天比较懒，一图胜万言
自己总结下吧：
缓存位置：
- service-worker（注册，监听，拦截请求，强制https，自由缓存）
- memory-cache（内存中，大小和时间限制较大，关闭tab就消失，但是速度快）
- disk-cache（硬盘中，大小和时间有保障，但是速度稍慢）
强缓存：
-
expires字段
http1.0的产物，相对来说比较落后了，但是也常作为一种兼容性的写法，它规定了资源到期的时间，容易受系统本地时间的影响而命中； -
cache-control
强缓存中最重要的属性，有多个值可以设定，常用的比如- max-age=300，代表接下来的300秒内，再次访问该资源，就会命中强缓存；
- no-cache，该值表示每次请求都会进行协商缓存，防止服务器资源内容和缓存中的不一致；
- no-store，完全不缓存，每次都会走服务器。
协商缓存：（headers中last-modified和E-tag）
浏览器带着缓存标识向服务器发送请求，会有两种状态：
- 304命中缓存
- 200正常响应，存入缓存
服务器如何判断资源是否发生变化了呢？
-
last-modified和if-modified-since:
第一次请求时，服务端会在response header中添加 Last-Modified（上次修改该资源的时间），返回给客户端，浏览器将这个resHeader进行缓存，缓存到last-modified记录中，下次请求的时候，会识别到有这个记录，将该记录的上次修改时间带上，传给服务端，服务端再进行判断，文件是否发生变化，从而响应相应的内容。 -
E-tag和if-none-match：
上面的方式有两种弊端：
1、单位只能以秒计，有误差；
2、如果文件只是打开，没有修改过，也会识别出不一致，资源浪费。
E-tag相当于获取到了文件的hash值，这跟文件内容就完全同步了，精度来说，优于last-modified，但是效率稍逊。
用户行为影响：
- 输入地址请求页面
浏览器会查找disk-cache中是否有缓存，没有则发送网络请求； - 不关闭tab页面，直接刷新
此时还可以使用memory-cache，优化匹配memory，然后disk - 当用户强制刷新会发生什么？（ctrl+f5）
这时所有请求的强缓存都换成了cache-control：no-cache，为了兼容还会带上（pragma: no-cache），返回200和最新内容。
终于放假了，8天假期，有点开心。
网友评论