这是我参与11月更文挑战的第10天，活动详情查看：2021最后一次更文挑战
解题要点：
1. 强缓存和协商缓存的概念、状态码
关键词： 200、304、from disk cache / from memory cache
2. 强缓存相关的浏览器 Header 属性及其每个属性的介绍
关键词： Expires、Cache-Control、Pragma
3. 协商缓存相关的浏览器 Header 属性及其每个属性的介绍
关键词： ETag — If-None-Match、Last-Modified — If-Modified-Since
4. 牵扯的优先级（加分）
- 强缓存和协商缓存的优先级
- 各个属性的优先级
答案：
1. 强缓存和协商缓存分别是什么，状态码和场景。
强缓存： 不会向服务器发送请求，直接从缓存中读取资源，在 Chrome 控制台的 Network 选项中可以看到该请求返回 200 状态码，并且 size 显示 from disk cache 或 from memory cache 两种。
协商缓存： 向服务器发送请求，服务器会根据这个请求的 request header 的一些参数来判断是否命中协商缓存，如果命中，则返回 304 状态码并带上新的 response header 通知浏览器从缓存中读取资源；
2. 强缓存相关的浏览器 Header
Expires — 过期时间，有可能因客户端 / 服务端时间设置不一致出现问题
Cache-Control — 缓存设置，存在 public、private、no-store、no-cache、max-age 几个属性，再分别介绍一下几个属性的作用
Pragma — 页面缓存，只有一个值：no-cache，作用和 Cache-Control 里的 no-cache 一样
强缓存中 from disk cache 和 from memory cache 的区别
3. 协商缓存相关的浏览器 Header
ETag — If-None-Match： 浏览器在下一次加载资源向服务器发送请求时，会将上一次返回的 Etag 值放到 Header 里的 If-None-Match 属性里，服务器接受到请求后取出 If-None-Match 的值，会拿来和这个资源文件的 Etag 值做比较，如果相同，则表示资源文件没有发生改变，命中协商缓存。（只要资源有变化，服务端的 Etag 就会重新生成）
Last-Modified — If-Modified-Since： Last-Modified 是该资源文件的最近修改时间，服务器会在 Header 里返回，同时浏览器会将这个值保存起来，下一次发送请求时，放到 Header 里的 If-Modified-Since 里，服务器在接收请求后也会做对比，如果相同则命中协商缓存。
Etag 的精确要优于Last-Modified，Last-Modified 的时间单位是秒，如果某个文件在 1 秒内改变了多次，那么他们的 Last-Modified 其实并没有体现出来修改，但是 Etag 每次都会改变确保了精度。 Etag 的性能要逊于 Last-Modified，毕竟 Last-Modified 只需要记录时间，而 Etag 需要服务器通过算法来计算出一个 hash 值。 服务器校验优先考虑 Etag。 所以，两者互补。
4. 牵扯的优先级（加分）
- 强缓存由于协商缓存
- from memory 优先于 from disk
- Cache-Control > Pragma > Expires
- Etag > Last-Modified
