什么是缓存
缓存是一种保存资源副本,并在下次请求时直接使用该副本的技术。
使用缓存是前端性能优化的重要方式,既可以提高响应的速度又可以减少不必要的重复请求,从而提高服务器的吞吐量.但有时候又不适用于所有情况,有时候使用反而会使用户体验变差,因此需要根据不同的请求指定不同的缓存策略.
什么是浏览器缓存
浏览器缓存就是浏览器把一个已经请求过的web资源拷贝一份副本存储在本地磁盘中.当再次访问相同的url时,浏览器会根据缓存机制决定是否直接使用副本响应访问请求,还是像服务器再次发送请求.
浏览器缓存的是什么
当然我们不可能缓存整个网页，网页现在大多是动态的，我们缓存的是那些静态资源（包括 js、css、img）
- 不能被缓存的:
- 网站的html是不能被缓存的.因为网站在使用过程中html随时可能被更新, 随时有可能被替换
- 网页的业务数据也是不能被缓存的.比如留言板和评论区,用户随时都可以在底下评论,那数据库的内容就会被频繁更新.
缓存策略概念
HTTP协议的缓存策略有两种，分别是强制缓存和协商缓存.
强制缓存的优先级大于协商缓存
强制缓存
强制缓存是服务器告诉浏览器一个缓存时间,在缓存时间内,下次请求直接用缓存,不在时间内,执行协商缓存策略.
简单来说:强制缓存就是文件直接从本地缓存中获取,不需要再发送请求获取资源
强制缓存流程图如下所示
从上图可以看到,当初次请求时,浏览器会向服务器发起请求,服务器接收到浏览器的请求后,返后资源并返后一个
cache-control给客户端,该cache-control一般设置缓存的最大过期时间.
因此浏览器已经接收到cache-control的值,那么这个时候浏览器再次发送请求时,它会先检它的cache-control是否过期,如果没过期则直接从本地缓存获取资源,返后到客户端,而无需再经过服务器.
强制缓存有过期时间，那么就意味着总有一天缓存会失效。那么假设某一天，客户端的 cache-control 失效了，那么它就没办法从本地缓存中拉取资源。于是它会重新向服务器发起请求，之后服务器会再次返回资源和 cache-control 的值。
协商缓存
协商缓存是一种服务端的缓存策略,即通过服务端来判断某件事情是不是可以被缓存,
协商缓存是让客户端与服务器之间能实现缓存文件是否更新的验证,提升缓存的复用率,讲缓存信息在的Etag和Last-Modified字段通过请求发送给服务器,由服务器校验.如果资源一致则返后304并继续使用浏览器缓存,反之若返回200和最新的资源.
协商缓存流程图如下所示
协商缓存：让客户端与服务器之间能实现缓存文件是否更新的验证、提升缓存的复用率，将缓存信息中的Etag和Last-Modified 通过请求发送给服务器，由服务器校验。如果文件没有改变，那么直接返回304状态，继续使用浏览器缓存。
HTTP缓存都是从第二次请求开始的：
- 第一次请求资源时,服务器返后资源,并在响应头首部中回传资源的缓存策略,
- 第二次请求时,浏览器判断这些请求参数,如果是强缓存就直接返回状态码200,否则就把请求参数加在请求头中并传给服务器,看是否协商缓存,如果是,则返后304,服务器会返回新的资源.
刷新缓存
我们平时对请求的不同处理对缓存的影响是不一样的,使用的缓存策略也是不同的,通常
- 第一次请求一般都是强制缓存有效
- 当是更新整个页面的操作的时候是协商缓存有效
正常请求操作
定义:地址栏输入url或者调整链接或者前进猴拖等 对缓存的影响:强制缓存有效,协商缓存有效
手动刷新
定义:F5或者刷新按钮或者右键菜单刷新 对缓存的影响:强制缓存失效,协商缓存有效
强制刷新
定义: ctrl+f5 对缓存的影响:强制缓存失效,协商缓存失效
