前端性能优化 浏览器缓存技术

Posted 2021-04-14 大数据Java张勇Linux数据库LTL

观点：

  浏览器强缓存是前端性能优化最有力的工具，没有之一，对于有静态资源的网页，一定要利用强缓存，提高响应速度。

目标：

  了解浏览器缓存原理，并能运用浏览器缓存优化项目。

浏览器缓存的原理

WEB服务软件对缓存的支持

谈档案软件如何运用浏览器缓存

开发时避免缓存的技巧

什么是浏览器缓存

开启浏览器缓存

可以通过以下两种方式对缓存进行控制：

（1）使用html Meta 标签

<meta http-equiv="Pragma" content="no-cache">

（2）使用缓存有关的HTTP消息报头

【 Expires 】 、 【 Cache-Control 】 、 【Last-Modified，If-Modified-Since】【ETag、If-None-Match】

浏览器缓存的分类

A、强缓存

不发请求到服务器，直接从浏览器的缓存中读取资源。

B、协商缓存

会发请求到服务器，不会返回这个资源的数据，而是告诉客户端可以直接从缓存中加载这个资源，于是浏览器就又会从自己的缓存中去加载这个资源。

强缓存的原理

强缓存是利用Expires或者Cache-Control这两个http response header实现的，它们都用来表示资源在客户端缓存的有效期。

Expires是http1.0提出的一个表示资源过期时间的header，它描述的是一个绝对时间，由服务器返回，用GMT格式的字符串表示，如：Expires:Thu, 31 Dec 2017 20:51:51 GMT。