启用文本压缩

Published on Updated on

Translated to: English, Español, 한국어, Pусский, 日本語

基于文本的资源应进行压缩,以尽量减少网络总字节数。Lighthouse 报告的 Opportunities 部分列出了所有未压缩的基于文本的资源:

Lighthouse 启用文本压缩审计的截图

Lighthouse 如何处理文本压缩

Lighthouse 收集的所有响应都:

  • 具有基于文本的资源类型。
  • 不包括设置为 brgzipdeflatecontent-encoding 标头。

Lighthouse 随后使用 GZIP 压缩每个响应以计算可能节省的字节数。

如果某个响应的原始大小小于 1.4KiB,或者可能节省的字节数小于原始大小的 10%,则 Lighthouse 不会在结果中标记该响应。

Lighthouse 列出的是在使用 GZIP 对响应进行编码的情况下可能节省的字节数。如果使用 Brotli,则可能节省更多。

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

在提供这些响应的服务器上启用文本压缩以通过此审计。

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

Accept-Encoding: gzip, compress, br

如果浏览器支持 Brotli (br) 您应该使用 Brotli,因为它比其他压缩算法更能减少资源的文件大小。搜索 how to enable Brotli compression in <X>,其中 <X> 是您的服务器的名称。截至 2020 年 6 月,除 Internet Explorer、Safari 桌面版和 iOS 上的 Safari 外,所有主流浏览器都已支持 Brotli。请参阅浏览器兼容性了解更新。

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

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

Content-Encoding: br

在 Chrome DevTools 中检查响应是否被压缩

要检查服务器是否压缩了响应:

  1. Press Control+Shift+J (or Command+Option+J on Mac) to open DevTools.
  2. Click the Network tab.
  3. 点击引起您感兴趣的响应的请求。
  4. 点击 Headers 选项卡。
  5. 检查 Response Headers 部分中的 content-encoding 标头。
content-encoding 响应标头
content-encoding 响应标头。

要比较响应的压缩和解压缩大小:

  1. Press Control+Shift+J (or Command+Option+J on Mac) to open DevTools.
  2. Click the Network tab.
  3. 启用大请求行。请参阅使用大请求行
  4. 查看您感兴趣的响应的 Size 列。上面的值是压缩大小,下面的值是解压缩大小。

另请参阅缩小和压缩网络有效负载

程序栈特定的指南

Joomla

启用 Gzip 页面压缩设置 (System > Global configuration > Server)。

WordPress

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

资源

Updated on 改进文章

This site uses cookies to deliver and enhance the quality of its services and to analyze traffic. If you agree, cookies are also used to serve advertising and to personalize the content and advertisements that you see. Learn more about our use of cookies.