①web 缓存主要指的是两部分：浏览器缓存和 http 缓存。
②浏览器缓存：
比如 localStorage, sessionStorage, cookie 等等。这里需要注意。像 localStorage，sessionStorage 这种用户缓存数据的功能，他只能保存 5M 左右的数据，多了不行。cookie 则更少，大概只能有 4kb 的数据；
③http 缓存：
1、Web 缓存是可以自动保存常见文档副本的 HTTP 设备。当 Web 请求抵达缓存时， 如果本地有 “已缓存的” 副本，就可以从本地存储设备而不是原始服务器中提取这 个文档；
2、http 缓存又分为两种两种缓存，强制缓存和协商缓存；
3、基于 Expires 字段实现的强缓存：
Expires 字段的作用是，设定一个强缓存时间。在此时间范围内，则从内存（或磁盘）中读取缓存返回。但已被废弃，因为 Expires 过度依赖本地时间，如果本地与服务器时间不同步，就会出现资源无法被缓存或者资源永远被缓存的情况；
4、基于 Cache-control 实现的强缓存：
Cache-Control:max-age=N，N 就是需要缓存的秒数。从第一次请求资源的时候开始，往后 N 秒内，资源若再次请求，则直接从磁盘（或内存中读取），不与服务器做任何交互；
5、Cache-control 有 max-age、s-maxage、no-cache、no-store、private、public 这六个属性。
a、max-age 决定客户端资源被缓存多久；
b、s-maxage 决定代理服务器缓存的时长；
c、no-cache 表示是强制进行协商缓存
d、no-store 是表示禁止任何缓存策略；
e、public 表示资源即可以被浏览器缓存也可以被代理服务器缓存；
f、private 表示资源只能被浏览器缓存；
6、基于 last-modified 的协商缓存：
基于 last-modified 的协商缓存实现方式是：首先需要在服务器端读出文件修改时间，将读出来的修改时间赋给响应头的 last-modified 字段，最后设置 Cache-control:no-cache；
6、基于 ETag 的协商缓存：
ETag 就是将原先协商缓存的比较时间戳的形式修改成了比较文件指纹；
7、ETag 缺点：
a、ETag 需要计算文件指纹这样意味着，服务端需要更多的计算开销。如果文件尺寸大，数量多，并且计算频繁，那么 ETag 的计算就会影响服务器的性能。显然，ETag 在这样的场景下就不是很适合；
b、ETag 有强验证和弱验证。
所谓将强验证，ETag 生成的哈希码深入到每个字节。哪怕文件中只有一个字节改变了，也会生成不同的哈希值，它可以保证文件内容绝对的不变。但是，强验证非常消耗计算量。
ETag 还有一个弱验证，弱验证是提取文件的部分属性来生成哈希值。因为不必精确到每个字节，所以他的整体速度会比强验证快，但是准确率不高。会降低协商缓存的有效性；
④总结：
1、有些缓存是从磁盘读取，有些缓存是从内存读取，有什么区别？答：从内存读取的缓存更快；
2、所有带 304 的资源都是协商缓存，所有标注（从内存中读取 / 从磁盘中读取）的资源都是强缓存；
（参考：mp.weixin.qq.com/s/dt9rgOOq3…
