浏览器缓存

浏览器的缓存一般发生在处理和响应过程。

浏览器缓存过程

1. 调用service-worker的fetch事件相应

2. 查看memory cache

3. 查看disk cache

• 如果强制缓存存在且失效，返回200；
• 如果强制缓存存在且未失效，使用对比缓存，根据情况决定返回200还是304

4. 发送网络请求，等待响应

5. 如果响应头配置信息允许，把相应返回的内容存在disk cache里

6. 把响应内容的引用存入memory cache

7. 把相应内容存入service worker的cache storage

 

浏览器缓存按位置分为：

memory cache(关闭浏览器就会被回收)，

disk cache(也会被浏览器用特定算法回收)，

service worker（新版本，更灵活）。

 

按照失效策略分类：

强制缓存：客户端请求后，浏览器会先访问缓存数据库看是否存在，如果存在要请求的数据就直接返回。如果不存在，则请求数据，加载并且存入缓存。

这样直接减小请求次数，提升最大，优化首选。

实现方法:

HTTP1.0中，设置请求头的Expires设置绝对失效日期，缺点：可通过修改系统日期导致失效

HTTP1.1中，设置请求头的Cache-control设置相对寿命，同时出现优先级高于Expires。

Cache-control的属性：

（1）public：所有内容都将被缓存（客户端和代理服务器都可缓存）

（2）private：所有内容只有客户端可以缓存，Cache-Control的默认取值

（3）no-cache：客户端缓存内容，但是是否使用缓存则需要经过协商缓存来验证决定

（4）no-store：所有内容都不会被缓存，即不使用强制缓存，也不使用协商缓存

（5）max-age=xxx (xxx is numeric)：缓存内容将在xxx秒后失效

协商（对比）缓存：询问服务器，与服务器进行对比确认请求资源的最后修改时间来确定是否需要返回新数据缓存新数据。如果未修改，返回304状态码，如果服务器资源更新了，返回200状态码并返回新资源。

协商对比的字段

对比修改日期：Last-Modified / If-Modified-Since： 最后修改时间，精确至秒。（Last-Modified）但是如果服务器数据以毫秒更新，则无法暗示更新换缓存。客户端再次发起该请求时，携带上次请求返回的Last-Modified值，通过此字段值告诉服务器该资源上次请求返回的最后被修改时间。（If-Modified-Since）

对比内容：Etag / If-None-Match：Etag是服务器响应请求时，返回当前资源文件的一个唯一标识； If-None-Match是客户端再次发起该请求时，携带上次请求返回的唯一标识Etag值，通过此字段值告诉服务器该资源上次请求返回的唯一标识值。