浏览器缓存
fygethub opened this issue · comments
缓存种类
浏览器自身的缓存严格意义上分为两种（严格意义上排除了cookie，storage，indexDb等）
1. memory cache
特指内存中的缓存、几乎所有的资源都能进入memory cache
- 内存大小有上限，后打开的tab达到上限会释放之前的tab缓存
- 作用范围为浏览器tab，关闭即释放
- 优先级高于disk cache
2. disk cache
特指硬盘中的缓存。是持久缓存，会存在实际的文件系统中（浏览器安装文件的cache目录中）
- 同样会有上线，浏览器自动清理
- 比memory cache 要慢
- 可跨回话访问同资源
其他
- 代理服务器缓存，存在网络中的共享缓存，面向大量用户，通过cache-control来控制是否允许代理服务器缓存
- CDN缓存，CDN分布网关的缓存，可以通过提供的接口刷新缓存
- service worker，html5的离线缓存技术，存储于浏览器cache storage（优先级最高）
缓存的策略
我们会根据自身的需要，设置缓存的策略来达到用户访问的性能提升，分别是：
1、 强缓存
通过设置cache control的max-age=time(相对时间）来控制（优先级高于http1.0的expires的绝对时间）。
如果资源处于max-age的有效时间，会直接浏览器缓存
cache control还有其他几个主要属性可以组合使用：
- public 允许代理服务器和浏览器缓存
- private 仅允许浏览器缓存
- no-cache 绕过浏览器，直接请求服务器是否使用缓存（浏览器自身依然缓存）
- no-stroe l浏览器和服务器都不可以缓存
2、协商缓存
当请求的资源过了max-age的有效时间，就会进入协商缓存阶段。这个时候请求服务器并携带If-None-Match：Etag
（根据文件内容生成的文件唯一标示）进行比较，一样则返回304，不一样则返回新资源和200。（etag优先级高于http1.0
的last-modified最后修改时间）
3、启发式缓存
当既没有设置max-age相对时间，也没有设置exprires绝对时间的时候，浏览器依然会请求缓存的内容，不是请求服务器而是
走协商缓存策略： 它的计算方式为根据响应头中2个时间字段 Date 和 Last-Modified 之间的时间差值，取其值的10%作为缓存时间周期
用户的行为
当cache control不是设置为no-store的时候：
1.打开新窗口 如果命中了强缓存，则请求disk cache，否则请求
2.刷新 如果存在缓存，优先命中memory cache ，其次是disk cache，否则请求
3.强制刷新 都会请求最新服务器资源
4.地址栏输入 同刷新