强缓存与协商缓存
三.缓存示例
分析
四.几个控制缓存策略的响应头强缓存
4.1 Expires
Expires是HTTP/1.0控制网页缓存的字段，其值为服务器返回该请求的结果缓存的到期时间，即再次发送请求时，如果客户端的时间小于Expires的值时，直接使用缓存结果。 到了HTTP/1.1，Expires已经被Cache-Control替代，原因在于Expires控制缓存的原理是使用客户端的时间与服务端返回的时间做对比，如果客户端与服务端的时间由于某些原因（时区不同；客户端和服务端有一方的时间不准确）发生误差，那么强制缓存将直接失效
4.2 Cache-Control
在HTTP/1.1中，Cache-Control是最重要的规则，主要用于控制网页缓存，主要取值为：
在无法确定客户端的时间是否与服务端的时间同步的情况下，Cache-Control相比于expires是更好的选择。
4.3 Pragma
Pragma 是HTTP/1.0标准中定义的一个header属性，请求中包含Pragma的效果跟在头信息中定义Cache-Control: no-cache相同，但是HTTP的响应头没有明确定义这个属性，所以它不能拿来完全替代HTTP/1.1中定义的Cache-control头。通常定义Pragma以向后兼容基于HTTP/1.0的客户端。
注：以上三个响应头，优先级顺序为：Pragma>Cache-Control>Expires
协商缓存
4.4 ETag
ETag 值是一个字符串，其内容通常是数据的哈希值，每个数据都有一个单独的标志，只要这个文件发生了改变，这个标志就会发生变化。
服务器可以在响应中返回 ETag，然后浏览器会在后续的请求中携带上这个参数来确定缓存是否需要更新。如果 ETag 值相同，说明资源未更改，服务器会返回 304（Not Modified） 响应码，浏览器就知道本地缓存仍然是可以使用的。
4.5 Last-Modified
服务器可以通过配置这个响应头，来向浏览器发送一个数据上次被修改的时间标签，例如：Last-Modified:Wed, 24 Apr 2019 02:54:16 GMT
这样浏览器就知道了该数据最后被修改的时间，后续请求中，会和服务器进行时间的比较，如果服务器上的时间比本地时间要新，说明数据有更改，浏览器需要重新下载数据。
五.实例
禁用缓存：
启用协商缓存：
强缓存：
分析
浏览器缓存的优点
1、减少了冗余的数据传输
2、减少了服务器的负担，大大提升了网站的性能
3、加快了客户端加载网页的速度
状态码为灰色的请求则代表使用了强制缓存，请求对应的Size值则代表该缓存存放的位置，分别为from memory cache 和 from disk cache。
from memory cache代表使用内存中的缓存，特点：快速读取「虽然读取速度高效，但内存必硬盘容量小的多，操作系统需要精打细算内存的使用，所以能让我们使用的内存必然不多」和时效性「一旦该进程关闭，则该进程的内容则会清空。」
from disk cache则代表使用的是硬盘中的缓存。浏览器读取缓存的顺序为memory –> disk。
内存缓存中有一块重要的缓存资源是 preloader 相关指令（例如）下载的资源。众所周知 preloader 的相关指令已经是页面优化的常见手段之一，它可以一边解析 js/css 文件，一边网络请求下一个资源。
在浏览器中，浏览器会在js和图片等文件解析执行后直接存入内存缓存中，那么当刷新页面时只需直接从内存缓存中读取(from memory cache)；而css文件则会存入硬盘文件中，所以每次渲染页面都需要从硬盘读取缓存(from disk cache)。
浏览器会把哪些文件丢进内存中？哪些丢进硬盘中？
关于这点，网上说法不一，不过以下观点比较靠得住：
浏览器缓存是后端还是前端控制呢？
答：的确是服务器设置，但是前端也要知道怎么设置的。 比如哪些资源缓存，采用何种缓存方式，更新策略如何。
来自：链接：
限时特惠：本站每日持续更新5-20节内部创业项目课程，一年会员
只需199元，全站资源免费下载点击查看详情
站长微信：
jjs406
