本文主要讲浏览器的强缓存与协商缓存以及缓存过程

浏览器发出请求

浏览器缓存

强缓存就发生在前两步,强缓存有两个规则,expries和max-age

expries: 指定资源在一个时间点之前都可以使用缓存

max-age: 表示在上一次有效请求之后的一个事件段内请求资源都可以使用缓存,max-age是cache-control的值cache-control:max-age=1000;

区别:

expries是http1.0的产物,是一个时间点,具有误差,如果改变本地时间,将对缓存是否有效产生影响;

max-age是http1.1的产物,是一个时间段,比expries更准确一些;在两者同时出现的情况下,max-age的优先级高与expries,在一些不支持http1.1的情况下expries就可以发挥作用了。

协商缓存

浏览器缓存

浏览器的协商缓存与两对参数有关

last-Modified 与 If-Modified-since

在浏览器第一次发出请求得到的响应头部中会有last-Modified,会随着资源一起被缓存起来,当强缓存失效的时候,浏览器发送的请求会携带一个名为last-Modified-since的参数,值未上一次请求响应的last-Modified,服务器收到请求之后就会将该资源的最后修改时间与last-Madified-since对比,如果未在last-Modified-since之后修改资源,则会返回304;

Etag与If-None-Match <Etag资源文件的唯一标识>

与上一对参数类似,但是Etag判断文件是否改变会更加准确一些,只要问价发生变化Etag就会更改,Etag由服务器生成;

区别:

Etag比last-Modified更加精确,last-Modified事件单位是s,当文件在1s之内改变多次,那么他们的Last-Modified其实并没有体现出来修改,但是Etag每次都会改变确保了精度;如果是负载均衡的服务器,各个服务器生成的Last-Modified也有可能不一致;

在性能上,Etag要逊于Last-Modified,毕竟Last-Modified只需要记录时间,而Etag需要服务器通过算法来计算出一个hash值。

在优先级上,服务器校验优先考虑Etag

 

强缓存协商缓存流程

浏览器缓存

 

参考: 深入理解浏览器的缓存机制

相关文章:

猜你喜欢
  • 2021-12-12
相关资源
相似解决方案