通过网络获取内容既缓慢，成本又高：大的响应需要在客户端和服务器之间进行多次往返通信，这拖延了浏览器可以使用和处理内容的时间，同时也增加了访问者的数据成本。因此，缓存和重用以前获取的资源的能力成为优化性能很关键的一个方面。

静态服务器（无缓存无更新请求数据）

• 优点：简单。
• 缺点：每次请求必须查找返回原始文件，浪费带宽。

有缓存-无更新请求数据（浏览器本地缓存）

• 优点：节省资源，速度快。
• 缺点：服务器缓存中的数据变了，浏览器不知道数据是否发生改变。

缓存作用：

缓存是指代理服务器或客户端本地磁盘内保存的资源副本，利用缓存可减少对源服务器的访问，可以节省通信流量和通信时间。

有缓存有更新请求数据

• 主要原理：请求被响应的时候，响应报文中有一个Expires ：Mon,10 Dec 1990 02:25:22GMT（过期时间），再一次进行请求的时候，用本地的时间与过期时间进行比较，如果本地时间小于过期时间，那么从缓存中获取，如果本地时间大于过期时间，重新向服务器发送请求获取，再一次发送新的过期时间。
• 优点：缓存可控制。
• 缺点：控制的功能太单一，这种格式的时间和容易写错。

HTTP协议中的控制缓存

通过响应来控制缓存，在响应头中主要有cache-control、pragma、expires三个响应头，其中expires是HTTP1.0中的响应头，后面直接跟一个缓存失效日期，但是服务器和客户端之间的时钟往往不同，因此通过该响应头来控制缓存失效时间不准确，一般不用，如果要设置客户端不缓存，则设置响应头“expires: -1”即可；pragema是HTTP1.1协议为了兼容HTTP1.0+协议，用来控制不缓存，“pragma: no-cache"；cache-control是HTTP1.1中的响应头，其参数为相对的秒值，即过多少秒缓存失效，因此建议使用该响应头来控制缓存失效时间，其后可以跟的内容有no-cache、no-store、max-age、must-revalidate

为了兼容各个协议版本，要想客户端不缓存资源，一般都添加三个响应头：cache-control: no-cache、pragma: no-cache、expires: -1。

想要了解跟多关于web前端培训课程内容欢迎关注尚硅谷web前端培训，尚硅谷除了这些技术文章外还有免费的高质量web前端培训课程视频供广大学员下载学习