浏览器怎么又双叒叕无响应了啊!!!

强缓存与协商缓存

缓存是个老生常谈的问题,缓存是直接影响到网站性能和用户体验的原因之一,今天我们来总结一下。

 缓存的优缺点

●优点

1.减少不必要的数据传输,节省带宽

2.减少服务器的负担,提升网站性能

3.加快网页的速度

4.用户体验好

●缺点

如果资源有更改,但是客户端不及时更新,会造成用户获取信息滞后。

简单了解之后,掌声有请我们今天的主人公——"强缓存小姐"和"协商缓存先生"!

首先请自我介绍一下。

强缓存 

大家好,我是强缓存。

很多人问我啊,你为什么叫强缓存呢?难道你是缓存姐姐?

其实我是个可以说是强制的意思。

当浏览器请求的时候,服务端在请求头里做了缓存配置,如果设置了强缓存,客户端就不会再次请求,而是直接从缓存中读取。

而我呢,有Expires、Cache-Control这俩超能力(头字段),如果同时存在时Cache-Control 优先级会更高。

如果使用的是Expires,它代表的是资源的过期时间,是一个GMT 格式的标准时间。

当客户端请求服务器的时候,服务器在返回资源的同时还会带上响应头Expires。

虽然在这个期间,它不仅为用户省了流量,还减少了重复读取的压力。但是呢,缓存过期时间是一个具体的时间,这个时间依赖于客户端的时间,如果时间不准确或者被改动缓存也会随之受到影响。

我为了更加精准,于是我就学会了Cache-Control这个能力,它既能出现在请求头,又能出现在响应头。

我们来看一下它的参数:

1. max-age

多少秒内是有效的

2. no-cache

跳过设置强缓存,但是不妨碍设置协商缓存

3. no-store

不缓存,客户端和服务端都不缓存

4. public

客户端和代理服务器都可以缓存该资源。刷新的时候会重新发起请求。

5. private

只让客户端可以缓存该资源;代理服务器不缓存

6.immutable

它这么设置的目的是为了让用户在刷新页面的时候不要去请求服务器。如果设置这个刷新的时候不会重新发起请求。

协商缓存 

你们好,我是协商缓存。

我一般在Cache-Control 的值为 no-cache (不强缓存)或者 max-age 过期了 (强缓存,但总有过期的时候)的时候出现(no-store除外)。

我有四个超能力(头字段),If-Modified-Since 和 Last-Modified一组,Etag 和 If-None-Match一组,当同时存在的时候会以Etag 和 If-None-Match为主。

当请求的时候,把用户本地该资源的 etag 同时带到服务端,服务端和最新资源做对比。如果资源没更改,返回304,浏览器读取本地缓存。如果资源有更改,返回200,返回最新的资源。

顺便介绍一下我的四个能力:

1. Etag

响应头,由服务器告诉浏览器。

2. If-None-Match

请求头,由浏览器告诉服务器,存的是第一次返回的Etag值。

3. Last-Modified

响应头,资源最近修改时间,由服务器告诉浏览器。

4. If-Modified-Since

请求头,资源最近修改时间,由浏览器告诉服务器。其实就是第一次访问服务端返回的Last-Modified的值。

不过我那Etag的新组合,却比Last-Modified的组合更加强大。它们可以解决老组合遇到的以下问题:

Q1:仅仅改变了时间,却没改变资源内容的时候。

Q2:某些文件修改的很频繁的时候,例如一秒内多次修改。

听完了我们两位嘉宾的自我介绍,想必大家对它们也有了一定的了解了。

这边偷偷和你们说下如何配置资源的缓存规则。

    可以在java中写如下代码:

response.setDateHeader("Expires", 0);response.setHeader("Cache-Control","no-cache");response.setHeader("Pragma", "no-cache");

赶快动手试试吧!

HR++

产品顾问→

马上咨询

推荐阅读

点击图片查看原文

点击图片查看原文

你“在看”我吗?