共计 1441 个字符，预计需要花费 4 分钟才能阅读完成。
前端缓存分两种：
- HTTP 缓存，次要用于 HTTP 申请资源时用到（仅 GET 申请），相干设置都在服务器端设置
- 浏览器缓存，浏览器缓存次要是咱们前端对于某些非凡数据进行本地缓存，相干设置在前端代码中设置
两种缓存应用到的属性如下：
HTTP 缓存过程
浏览器第一次向服务器发动申请后拿到对应的资源，会依据响应报文中 HTTP 头的缓存标识决定是都缓存资源。前面再次申请该资源时候上面两种状况：
如果是强缓存，并且资源被缓存，那么浏览器前面每次发动申请时都会在缓存中查找申请的资源，并判断标识资源是否无效，有效则发送申请到服务端，如果无效则间接应用缓存资源。
如果是协商缓存，申请将携带标识传递给服务器，服务器依据标识判断缓存是否无效，无效则走 304，有效则查找新的资源返回给前端。
强缓存分两种规定进行缓存
Cache-Control
Cache-Control 是在 HTTP/1.1 中应用的一种缓存形式，它外面次要能够设置上面几个属性：
public：所有内容都将被缓存
private：所有内容只有在客户端能够缓存，Cache-Control 默认取值
no-cache：客户端缓存内容，然而是否应用缓存须要通过协商缓存来验证决定
no-store：所有内容都不会被缓存，包含强缓存和协商缓存
max-age=600（600 is numeric）：缓存内容将在 600 秒后生效Expires
expires 是通过设置相对工夫来进行缓存，例如：expires: Fri, 01 Jan 1990 00:00:00 GMT
Cache-Control 和 Expires 两者比拟
Cache-Control 应用的是绝对工夫，个别是设置多长时间后过期，Expires 设置的是相对工夫，过了设置的工夫后过期，而且这个工夫是依据服务器的工夫来确定的，可能存在客户端与服务端工夫不同步的状况造成过期工夫不精确。另外 Cache-Control 的优先级比 expires 高，如果都设置的状况下优先应用前者。
留神点：强缓存的判断过程在发动申请之前，所以如果命中缓存这里是不须要与服务器进行任何交互的
协商缓存
协商缓存是在强缓存生效后，并且资源设置了协商缓存标识，那么发动申请时会携带缓存标识，服务器接管到申请后会比照标识，判断资源是否无效。如果失效返回 304，浏览器去缓存获取资源。如果有效则服务器间接查问相干资源返回。
协商缓存应用到的几个字段
- Last-Modified/If-Modified-Since
- Etag/If-None-Match
last-Modify 是服务器资源的最新批改工夫，然而这个工夫批改了，然而资源未必肯定有变更。
Etag 是依据文件的内容生成的惟一标识，如果它变动了，那么资源必定有变更，所以 Etag 绝对于 Last-Modified 来说更加的精确，所有 Etag 的优先级要高于 Last-Modified
If-Modified-Since 与 If-None-Match 取对应缓存字段的值传递给后端，后端依据值去比对
最初对于 HTTP 缓存的流程咱们大略理解了，然而这些资源到底缓存到哪里去了呢？
分两种模式 memory cache/disk cache，前者示意内存缓存，后者示意硬盘缓存
- memory cache 内存缓存，浏览器敞开资源被销毁，再次关上须要从新获取，个别会将脚本、字体、图片等存在内存中。
- disk cache 硬盘缓存，敞开浏览器下次关上资源仍旧是 from disk cache，个别缓存一些非脚本文件，比方 css
浏览器缓存对于大多数人都比价相熟，这里就 …
