梦幻联动：浏览器-缓存
语雀内容

后端缓存主要集中于“处理”步骤，通过保留数据库连接，存储处理结果等方式缩短处理时间，尽快进入“响应”步骤。
而前端缓存则可以在剩下的两步：“请求”和“响应”中进行。
在“请求”步骤中，浏览器也可以通过存储结果的方式直接使用资源，直接省去了发送请求；
而“响应”步骤需要浏览器和服务器共同配合，通过减少响应内容来缩短传输时间。

缓存位置分类

HTTP 协议头的那些字段，都属于 disk cache 的范畴，例如 Cache-Control, ETag, max-age 等

在 Chrome 的开发者工具中，Network -> Size 一列看到一个请求最终的处理方式：如果是大小 (多少 K， 多少 M 等) 就表示是网络请求，否则会列出 from memory cache, from disk cache 和 from ServiceWorker。

优先级：

1. Service Worker
2. Memory Cache
3. Disk Cache
4. 网络请求

Memory Cache

内存缓存：
几乎所有的网络请求资源都会被浏览器自动加入到 memory cache 中
常规情况下，浏览器的 TAB 关闭后该次浏览的 memory cache 便告失效

1、preloader：
被 preloader 请求过来的资源就会被放入 memory cache 中，供之后的解析执行操作使用

2、preload
显式预加载的资源

memory cache 机制保证了一个页面中如果有两个相同的请求 (例如两个 src 相同的 <img>，两个 href 相同的 <link>) 都实际只会被请求最多一次，避免浪费

不过在匹配缓存时，除了匹配完全相同的 URL 之外，还会比对他们的类型，CORS 中的域名规则等

假性的拒绝缓存：
在从 memory cache 获取缓存内容时，浏览器会忽视例如 max-age=0, no-cache 等头部配置。例如页面上存在几个相同 src 的图片，即便它们可能被设置为不缓存，但依然会从 memory cache 中读取。因为max-age=0 在语义上普遍被解读为“不要在下次浏览时使用”，memory cache 只是短期使用，大部分情况生命周期只有一次浏览，所以这样的缓存字段设置是假性的，还是会被短期缓存
===》
如果想彻底拒绝缓存，就连短期也不行，那就no-store

disk cache

存储在文件系统中，允许相同的资源在跨会话，甚至跨站点的情况下使用，例如两个站点都使用了同一张图片。
disk cache 是根据http各类字段来命中决定缓存的，绝大部分的缓存都来自 disk cache

service worker

我们可以选择放哪些钱(缓存哪些文件)，什么情况把钱取出来(路由匹配规则)，取哪些钱出来(缓存匹配并返回)

失效策略

强制缓存

强制缓存的字段是 Cache-control 和 Expires