针对重复访问，HTTP 缓存可以缩短网页加载时间。
当浏览器请求资源时 提供资源的服务器可以向浏览器 应临时存储或缓存资源多长时间。 对于对该资源的任何后续请求 浏览器会使用其本地副本，而不是从网络获取。
Lighthouse 缓存政策审核如何失败
灯塔 标记所有未缓存的静态资源：
Lighthouse 将资源视为可缓存 如果满足以下所有条件：
- 资源是字体、图片、媒体文件、脚本或样式表。
- 资源具有
200、203或206HTTP 状态代码。 - 该资源没有明确的无缓存政策。
如果某个网页未通过审核， Lighthouse 在包含以下三列的表格中列出结果：
| 网址 | 可缓存资源的位置 |
| 缓存 TTL | 资源的当前缓存时长 |
| 传输大小 | 显示标记的资源被缓存后，用户可节省的预估数据量 |
如何使用 HTTP 缓存来缓存静态资源
将您的服务器配置为返回 Cache-Control HTTP 响应标头：
Cache-Control: max-age=31536000
max-age 指令用于告知浏览器应将资源缓存多长时间（以秒为单位）。
以下示例将时长设置为 31536000，对应于 1 年：
60 秒 × 60 分钟 × 24 小时 × 365 天 = 31536000 秒。
您应长时间缓存不可变的静态资源， 例如一年或更长时间
如果资源更改且新鲜度很重要，请使用 no-cache。
但您仍想享受缓存的一些速度优势。
浏览器仍会缓存设置为 no-cache 的资源
但首先需要与服务器进行检查，以确保资源仍然是最新的。
较长的缓存时长并不总是更好。 归根结底 您可以自行决定资源的最佳缓存时长。
有许多指令可用于自定义浏览器缓存不同资源的方式。 如需详细了解如何缓存资源，请参阅 HTTP 缓存：第一道防线指南 和“配置 HTTP 缓存行为”Codelab。
如何在 Chrome 开发者工具中验证缓存的响应
要查看浏览器从缓存中获取了哪些资源 在 Chrome 开发者工具中打开 Network 标签页：
[注释]：<>（以下列表是来自 web.dev 的简码，但未从英语翻译成任何语言。）
1. 按 Control+Shift+J（在 Mac 上，按 Command+Option+J）打开开发者工具。
2. 点击网络标签页。
Chrome 开发者工具中的 Size 列可以帮助您验证资源是否已缓存：
Chrome 从内存缓存提供请求最多的资源，速度非常快， 但会在浏览器关闭时清除。
如需验证资源的 Cache-Control 标头是否按预期设置，请执行以下操作：
检查其 HTTP 标头数据：
- 在“Request”表格的 Name 列下，点击相应请求的网址。
- 点击 Headers 标签页。
Cache-Control 标头。
针对特定堆栈的指南
Drupal
在管理 > 中设置浏览器和代理缓存的最长存在时间 配置 >开发页面。请参阅 Drupal 性能资源。
Joomla
请参阅缓存。
WordPress
请参阅浏览器缓存。