启用文本压缩

基于文本的资源应经过压缩处理,以最大限度减少网络总字节数。 Lighthouse 报告的“优化建议”部分列出了所有未压缩的文本资源:

Lighthouse 的“启用文本压缩审核”功能的屏幕截图

Lighthouse 如何处理文本压缩

Lighthouse 收集符合以下条件的所有响应:

  • 具有基于文本的资源类型。
  • 请勿添加设置为 brgzipdeflatecontent-encoding 标头。

然后,Lighthouse 使用 GZIP 压缩其中的各项内容以计算可能节省的费用。

如果响应的原始大小小于 1.4KiB,或者如果潜在的压缩缩减小于原始大小的 10%,则 Lighthouse 不会在结果中标记该响应。

如何在服务器上启用文本压缩

在提供这些响应的服务器上启用文本压缩,才能通过此审核。

当浏览器请求资源时,它将使用 Accept-Encoding HTTP 请求标头来指示它支持的压缩算法。

Accept-Encoding: gzip, compress, br

如果浏览器支持 Brotli (br),则应使用 Brotli,因为与其他压缩算法相比,Brotli 可以缩减资源的文件大小。搜索 how to enable Brotli compression in <X>,其中 <X> 是您的服务器的名称。自 2022 年 12 月起,Brotli 在所有主流浏览器(iOS 版 Safari)均受支持。如需了解相关更新,请参阅浏览器兼容性

使用 GZIP 作为 Brotli 的后备。所有主流浏览器都支持 GZIP,但其效率不如 Brotli。如需查看示例,请参阅服务器配置

您的服务器应返回 Content-Encoding HTTP 响应标头,以指明其使用的压缩算法。

Content-Encoding: br

在 Chrome 开发者工具中检查响应是否经过压缩

如需检查服务器是否压缩响应,请执行以下操作:

Control+Shift+J(在 Mac 上,按 Command+Option+J)以打开开发者工具。 点击 Network (网络)标签。

[comment]: <>(以下列表是 web.dev 中的短代码,并没有从任何语言翻译成英语。) 1. 按 Control+Shift+J(在 Mac 上,按 Command+Option+J)以打开开发者工具。 2. 点击 Network 标签页。 3. 点击引起您感兴趣的回复的请求。 4. 点击 Headers 标签页。 5. 检查响应标头部分中的 content-encoding 标头。

内容编码响应标头
content-encoding 响应标头。

如需比较响应的压缩后大小和解压缩大小,请执行以下操作:

[comment]: <>(以下列表是 web.dev 中的短代码,并没有从任何语言翻译成英语。) 1. 按 Control+Shift+J(在 Mac 上,按 Command+Option+J)以打开开发者工具。 2. 点击 Network 标签页。 3. 启用大型请求行。 请参阅使用大型请求行。 4. 查看 Size 列,找到您感兴趣的回复。最大的值是压缩后的大小。底部值是解压缩后的大小。

另请参阅缩减和压缩网络载荷

针对特定堆栈的指南

Joomla

启用“Gzip 页面压缩”设置(系统 > 全局配置 > 服务器)。

WordPress

在网络服务器配置中启用文本压缩。

资源