文章目录
一、强缓存
强缓存是指浏览器在请求资源时,先检查本地缓存是否存在该资源的副本,并且该副本是否有效。如果有效,浏览器直接从本地缓存中获取资源,不会发送请求到服务器。
使用强缓存策略时,如果缓存资源有效,则直接使用缓存资源,不必在向服务器发起请求。
常见的强缓存策略有两种:Expires 和 Cache-Control:
- Expires 是HTTP/1.0协议中的字段,它告诉浏览器资源的过期时间。当浏览器再次请求该资源时,会先比较当前时间与过期时间,如果未过期则直接使用本地缓存,否则再向服务器发送请求。
- Cache-Control 是HTTP/1.1协议中的字段,它可以设置多个指令来控制缓存行为。常用的指令有:max-age、no-cache、no-store等。其中,max-age 指令告诉浏览器资源的有效期,no-cache 指令告诉浏览器不使用强缓存,而是使用协商缓存。
二、协商缓存
协商缓存是指当强缓存失效时,浏览器发送请求到服务器,通过与服务器进行协商来确定是否可以使用缓存的副本。
如果命中强制缓存,我们无需发起新的请求,直接使用缓存内容,如果没有命中强制缓存,如果设置了协商缓存,这个时候协商缓存就会发挥作用。
常见的协商缓存策略有两种:Last-Modified 和 ETag:
- Last-Modified 是服务器响应头中的字段,它表示资源的最后修改时间。当浏览器再次请求该资源时,会携带 If-Modified-Since 字段,将资源的最后修改时间发送给服务器。如果服务器判断该资源的最后修改时间与 If-Modified-Since 字段相同,则返回 304 Not Modified 状态码,告诉浏览器可以使用缓存的副本。
- ETag 是服务器响应头中的字段,它是一个唯一标识符,表示资源的版本号。当浏览器再次请求该资源时,会携带 If-None-Match 字段,将资源的 ETag 值发送给服务器。如果服务器判断该资源的 ETag 值与 If-None-Match 字段相同,则返回 304 Not Modified 状态码,告诉浏览器可以使用缓存的副本。
强缓存和协商缓存的使用可以减少对服务器的请求次数,提高页面加载速度,提升用户体验。
总结
强缓存策略和协商缓存策略在缓存命中时都会直接使用本地的缓存副本,区别只在于协商缓存会向服务器发送一次请求。它们缓存不命中时,都会向服务器发送请求来获取资源。在实际的缓存机制中,强缓存策略和协商缓存策略是一起合作使用的。浏览器首先会根据请求的信息判断,强缓存是否命中,如果命中则直接使用资源。如果不命中则根据头信息向服务器发起请求,使用协商缓存,如果协商缓存命中的话,则服务器不返回资源,浏览器直接使用本地资源的副本,如果协商缓存不命中,则浏览器返回最新的资源给浏览器。
为什么需要浏览器缓存?
对于浏览器的缓存,主要针对的是前端的静态资源,最好的效果就是,在发起请求之后,拉取相应的静态资源,并保存在本地。如果服务器的静态资源没有更新,那么在下次请求的时候,就直接从本地读取即可,如果服务器的静态资源已经更新,那么我们再次请求的时候,就到服务器拉取新的资源,并保存在本地。这样就大大的减少了请求的次数,提高了网站的性能。这就要用到浏览器的缓存策略了。
所谓的浏览器缓存指的是浏览器将用户请求过的静态资源,存储到电脑本地磁盘中,当浏览器再次访问时,就可以直接从本地加载,不需要再去服务端请求了。
使用了浏览器缓存,有以下优点:
- 减少了服务器的负担,提高了网站的性能
- 加快了客户端网页的加载速度
- 减少了多余网络数据传输