如何启用 GZIP 压缩以加速 WordPress 网站

已发表: 2020-10-16

加快 WordPress 网站速度的最简单方法是消除其所有不需要的资源。 加速它的第二个最简单的方法是压缩所有想要的资源。 在您的 Web 服务器上启用 GZIP 压缩是实现这一目标的最简单和最有效的方法之一。

所有现代浏览器默认都支持 GZIP 压缩。 但是,要为您的用户提供压缩资源而不会出现问题,您必须正确配置您的服务器。

在这篇文章中,您将了解 Web 上数据压缩的基础知识、什么是 GZIP 压缩、它的各种好处,以及如何使用它来加速不同服务器设置上的 WordPress 站点。

兴奋的? 让我们解压!

喜欢看视频版?

加快#WordPress 网站速度的最简单方法:摆脱不需要的资源。 第二个最简单的方法:压缩所有想要的资源。 学习使用 GZIP 压缩快速做到这一点点击鸣叫

Web 上数据压缩的基础知识

网络上的数据压缩是减少网站传输的数据大小的过程。 根据数据类型(文本、图像、样式表、脚本、字体)的不同,有多种方法可以压缩数据。

网页主要组件的图示
网页的主要组成部分

例如,缩小 HTML、CSS 和 JavaScript 是减少浏览器发送数据量的简单方法。 在这里,压缩器通过从源代码中删除不必要的字符(例如注释和空格)来压缩文本。

在下面的简单 HTML 文档示例中,存在三种内容类型:HTML 标记、CSS 样式和 JavaScript 代码。

每种内容类型都有独特的语法和语义。 总的来说,这个 HTML 文档总共有 357 个字符。

 < html > < head > < style > /* kinsta-banner is used on the homepage only */ .kinsta-banner { font-size: 150% } .kinsta-banner { width: 75% } </ style > </ head > < body > <!-- kinsta banner START --> < div >...</ div > <!-- kinsta banner END --> < script > kinstaScripts(); // random scripts used on the page </ script > </ body > </ html >

上面的代码很容易阅读和遵循。 它是开发的理想选择。 但是,浏览器没有必要阅读评论并拥有完美缩进的标签。 智能压缩器可以分析此文档并从中删除所有不必要的部分。

 < html >< head >< style >.kinsta-banner{font-size:150%;width:75%}</ style ></ head >< body >< div >...</ div >< script >kinstaScripts();</ script ></ body ></ html >

缩小后,HTML 文档减少到只有 141 个字符。 这节省60.50%的字符数。 这在眼睛上并不容易,但这对浏览器来说并不重要。 它仍然会向用户显示相同的页面。

要利用这两个版本,您可以将原始文档维护为“开发版本”,但在将其发布之前压缩所有代码。

大多数 WordPress 性能插件会自动为您解决这个问题。

未压缩与缩小 jQuery 的文件大小比较
未压缩与缩小 jQuery 的文件大小压缩

例如, jQuery 3.5.1库的未压缩版本比同一文件的缩小版本大 3 倍以上。

同样,上述相同的压缩技术可以优化其他内容类型,如图像、视频、字体等。 像这样的特定于内容的减少是优化网站基于文本的资产大小的第一步。

但是数据压缩不仅仅是缩小。 使用先进的数学技术,数据压缩算法可以进一步减少数据的大小。

这种数据压缩方法最流行的例子之一是GZIP 。 它实现了高效的数据传输,并为使互联网成为可行的全球通信媒介做出了重大贡献。

什么是 GZIP 压缩?

GZIP 是GNU Zip的缩写,是网络上最流行的无损数据压缩方法。 它允许您减小站点的 HTML 页面、样式表和脚本的大小。

除了是一种数据压缩算法,GZIP 还是一种文件扩展名( .gz )和用于文件压缩/解压缩的软件。

它基于 DEFLATE 算法,该算法是 LZ77 编码和 Huffman 编码算法的混合。

GZIP 压缩如何基于 DEFLATE 算法的图示
GZIP 压缩基于 DEFLATE 算法

GZIP 压缩器获取一组原始数据并对其进行无损压缩。 原始数据可以来自任何文件类型,但 GZIP 最适用于基于文本的资产(例如 HTML、CSS、JS)。

下一节将深入介绍 GZIP 压缩的工作原理。

GZIP 如何压缩数据

GZIP 压缩如何工作的粗略说明
GZIP 压缩如何工作的粗略说明

首先,GZIP 压缩器对原始数据运行 LZ77 压缩算法以消除冗余。 该算法通过在预定义的滑动窗口(原始数据的一小部分)中查找重复模式来工作。

然后它用元组替换所有重复的字符串以压缩原始数据。

LZ77编码算法图解
LZ77编码算法图解

在上面的例子中,滑动窗口大小只有 13 个字符长(13 个字节)。 但是,GZIP 压缩可以使用 32 KB(32,768 字节)的最大滑动窗口大小。 滑动窗口的大小对 LZ77 的压缩性能起着关键作用。

在使用 LZ77 算法压缩原始数据后,GZIP 压缩器然后使用 Huffman 编码算法对其进行进一步压缩。 它通过为出现频率更高的字符分配最少的位数,同时为稀有字符分配最高位数来实现这一点。

这种技术类似于摩尔斯电码中使用的技术,其中在英语中出现得更频繁的字母得到最短的序列。

要了解 Huffman 编码算法的工作原理,请考虑BOOKKEEPER一词。 它有 10 个字符长,但只有 6 个唯一字符。 这个词很好地混合了单字母、双字母和三字母。

几乎所有的网站都使用 UTF-8 字符编码来表示字母和符号。 UTF-8 中的每个 ASCII 字符(也包括英文字母表)使用 1 个字节(8 位)。

“BOOKKEEPER”这个词有很多重复的字母
“BOOKKEEPER”这个词有很多重复的字母

BOOKKEEPER这样的 10 个字符的字符串将需要 10 个字节(80 位)的内存。 您可以看到它包含字母B , P , R的 1 个实例,字母OK的 2 个实例,以及字母E的 3 个实例。

霍夫曼编码算法利用这些知识对字符串进行无损压缩。 它通过生成一个将每个唯一字母作为叶子的二叉树来做到这一点。

频率最低的字母(例如BPR )会发现自己位于树的底部,而那些频繁出现的字母(例如EOK )理想情况下会发现自己位于树的顶部。

树中最顶层的节点是root ,它的值等于字符串中的字符总数。

“BOOKKEEPER”一词的霍夫曼树
“BOOKKEEPER”一词的霍夫曼树

生成霍夫曼树后,所有的左分支和右分支箭头分别被赋予01数字。 然后,您可以通过跟踪从根到叶的路径并连接所有01来为任何字符生成 Huffman 代码。

霍夫曼代码是每个字符的唯一二进制代码
霍夫曼代码是每个字符的唯一二进制代码

您会注意到频率最高的字母具有最小位大小的霍夫曼代码。

注意:霍夫曼编码算法可以通过对具有相同频率的字符使用不同的排序策略来生成替代二进制代码。 但是,编码字符串的总大小将保持不变。

编码为 25 位字符串的 80 位字
编码为 25 位字符串的 80 位字

存储原始单词所需的内存减少了68.75%

使用具有0 / 1约定的霍夫曼树生成满足前缀属性的二进制代码。 它确保任何特定字符的 Huffman 代码不是任何其他字符代码的前缀,从而可以轻松地使用 Huffman 树对编码字符串进行解码。 这在 GZIP 解压缩速度中起主要作用。

就像上面所说的那样,GZIP 压缩器使用 Huffman 编码算法来进一步优化 LZ77 算法生成的元组。 这会产生带有 .gz 扩展名的高度压缩文件。

如果您有兴趣了解有关 GZIP 工作原理的更多信息,请参阅此视频以获取快速概览。

GZIP 压缩有多好?

通常,GZIP 对小文件的压缩率约为 70%,但对于较大的基于文本的资产,它可以达到 90%。

各种 CSS 和 JS 库的 GZIP 压缩比比较
一些流行的 CSS 和 JS 库的 GZIP 压缩比

在上表中,您可以看到使用 GZIP 压缩压缩文件可以进一步减小它们的大小。

注意:您可以使用 GZIP 压缩任何文件类型,但对于已经使用其他方法(例如图像、视频)压缩的资产,这不会节省任何费用。 有时,它甚至可能会增加文件大小。

压缩算法的强度不仅取决于它的压缩率,还取决于它压缩和解压缩数据的速度和效率。 这就是 GZIP 在大多数用例中的优势所在。

由于 GZIP 使用流式算法快速解压缩,因此非常适合速度至关重要的 Web 协议。 此外,GZIP 使用最少的资源来压缩和解压缩数据,使其成为服务器和客户端的理想选择。

brotli vs bzip2 vs GZIP vs xz 的压缩性能(来源:OpenCPU)
brotli vs bzip2 vs GZIP vs xz 的压缩性能(来源:OpenCPU)

上图比较了brotlibzip2gzipxz压缩算法的压缩性能。 GZIP 在压缩比测试中略有下降,但在压缩和解压缩速度方面,它完全击败了竞争对手。

查看压缩速度图,我们可以得出结论,GZIP 非常适合在 HTTP 服务器和 Web 上的其他数据流中进行实时压缩。 考虑到它在推进网络方面的所有积极作用,IETF 批准 GZIP 作为 HTTP/1.1 中压缩的三种标准格式之一。

注意: GZIP 压缩库的抽象称为zlib用于许多流行的操作系统(Linux、macOS、iOS)和现代游戏机(PlayStation 4、Wii U、Xbox One)。 它也用于压缩图像的无损 PNG 文件格式。

GZIP 压缩的 6 大优势

让我们仔细看看 GZIP 压缩的最重要优势。

提供不错的压缩比

如前所述,与竞争对手相比,GZIP 的压缩率并不高。 但这也离他们不远。 通常,它可以帮助您将基于文本的资源的大小减少 70-90%。

超快速压缩和解压

对于数据压缩和解压缩速度,GZIP 无疑是赢家。 它非常适合 HTTP 服务器和其他数据流中的动态压缩。

需要很少的内存

GZIP 留下了最小的内存占用,使其适用于内存容量有限的服务器和系统。 因此,您会发现即使是最便宜的网络托管服务提供商也支持它。

即使在最坏的情况下也不会扩展太多

像 GZIP 这样的无损数据压缩算法有一个严格的限制,超出了它们就不能压缩数据。

通常,当资源已经被很好地压缩,或者它很小并且添加 GZIP 字典的开销高于压缩节省时,就会发生这种情况。 我们可以将这种现象归因于一个称为熵编码的概念。 GZIP 对这种影响有很强的抵抗力。

免费使用和开源

GZIP 最初是作为早期 Unix 系统中使用的专利压缩程序的免费、开源替代品而创建的。 因此,它没有任何专利,任何人都可以自由使用。

享有普遍支持

据 W3Techs 称,他们跟踪的所有网站中有82%使用 GZIP 压缩,使其成为网络上使用最广泛的压缩算法。

几乎所有服务器和客户端都支持 GZIP。 无论您在哪个服务器上托管您的网站,您都可以通过启用 GZIP 来加速它。

网站速度测试工具中的 GZIP 警告

除了缩小之外,启用 GZIP 是您可以在网站上实施的最简单、最有效的速度优化之一。

这也是优化 WordPress 的最简单方法之一。 尽管如此,许多 WordPress 网站仍然不使用它。

当您访问一个网站时,您的浏览器会通过检查content-encoding: gzip响应标头来检查 Web 服务器是否启用了 GZIP。 如果标头存在,它会检索压缩文件,解压缩它们,然后自动将较小的文件提供给您。

“内容编码:gzip”响应标头
Chrome DevTools 中的“content-encoding: gzip”响应标头

如果浏览器没有检测到 GZIP 响应标头,它会下载未压缩的文件。 在大多数情况下,页面加载速度的差异可能是几秒。 因此,如果您没有启用 GZIP,您会在网站速度测试工具中看到警告。

Google PageSpeed Insights / Lighthouse 中的 GZIP 警告

当您的网站未启用任何文本压缩时,Google PageSpeed Insights 会发出警告。

注意: Google PageSpeed Insights 和 Google Lighthouse 是两个独立的网站性能测试工具。 他们彼此独立工作,直到 2018 年 Google 升级 PageSpeed Insights 以使用 Lighthouse 作为其分析引擎。 因此,PageSpeed Insights 和 Lighthouse 现在是一回事。

Google PageSpeed Insights 中的“启用文本压缩”警告
Google PageSpeed Insights 中的“启用文本压缩”警告

在上面的示例站点中,压缩基于文本的资源可以将页面重量减少78% 以上,并将页面加载时间加快2.1 秒

注意: PageSpeed Insights 依赖于服务器返回给您的浏览器的响应标头。 有时,即使您启用了 GZIP 压缩,它也可能会显示错误警告。 这可能是因为在使用中间代理服务器或安全软件的机器上运行速度测试。 它们可能会干扰从外部服务器下载压缩文件。

GTmetrix 中的 GZIP 警告

如果您的网站不提供基于文本的压缩资源,GTmetrix 会显示警告。 与 Google PageSpeed Insights 一样,它还会向您展示您可以实现的潜在节省。

GTmetrix 中的“启用压缩”警告
GTmetrix 中的“启用压缩”警告

注意: GTmetrix 正在升级其速度测试算法,以使用最新的 Google Lighthouse 指标替换旧的 PageSpeed Insights 和 YSlow 库。 您可以预期它的 GZIP 压缩警告与 Lighthouse 显示的类似。

Pingdom 工具中的 GZIP 警告

Pingdom Tools 会直接发出警告,要求您使用 GZIP 压缩您的网站组件。

Pingdom 工具中的“使用 GZIP 压缩组件”警告
Pingdom 工具中的“使用 GZIP 压缩组件”警告

在描述部分,Pingdom Tools 还为您提供了一些关于 GZIP 重要性的统计数据。 酷豆!

WebPageTest 中的 GZIP 警告

如果 WebPageTest 检测到未以最优化的方式提供任何可压缩响应,则会在其性能审查选项卡中显示警告。

WebPageTest 中的“使用 GZIP 压缩”警告
WebPageTest 中的“使用 GZIP 压缩”警告

WebPageTest 还会给出一个分级分数,以显示警告的严重程度。 例如,它将上述警告评为 23 分(满分 100 分),这意味着您应该优先解决它。

如何检查是否启用了 GZIP 压缩

所有现代浏览器都有效地支持Accept-Encoding: gzip, deflate HTTP 标头。 因此,包括 Kinsta 在内的大多数 Web 主机默认在其所有服务器上启用 GZIP 压缩。

当 Web 服务器看到浏览器发送的此标头时,它们会识别出浏览器对 GZIP 的支持,并使用content-encoding: gzip标头以压缩的 HTTP 响应进行响应。

但是,如果您使用的是其他 WordPress 托管服务提供商,或者您只是想确认您的网站是否正确地提供 GZIP 压缩内容,请务必检查它是否已启用。

以下是检查 GZIP 压缩的一些简单方法。

1.在线GZIP压缩测试工具

使用在线工具是检查您的网站是否启用了 GZIP 压缩的最简单方法。 我建议使用免费的 Check GZIP Compression 或 HTTP Compression Test 工具。 只需输入您的网站 URL,然后点击检查测试按钮。

这两种在线工具都会向您显示是否启用了 GZIP 的简要报告,以及通过提供启用 GZIP 压缩的测试 URL 已保存(或可能保存)的数据传输量。

第一个工具还将向您显示其他相关信息,例如您网站的服务器类型、内容类型和压缩时间。

使用 Check GZIP Compression 工具测试 Kinsta 的主页
使用 Check GZIP Compression 工具测试 Kinsta 的主页
使用 HTTP 压缩测试工具测试 Kinsta.com
使用 HTTP 压缩测试工具测试 Kinsta.com

您应该注意,GZIP 优化不仅仅停留在您的网页上,还包括其基于静态文本的资产,如样式表、脚本和字体。 如果您使用 CDN 来提供这些资产,那么您需要确保 CDN 也在启用 GZIP 压缩的情况下为它们提供服务。

Cloudflare、Kinsta CDN、KeyCDN 和 CloudFront 等大多数现代 CDN 都支持 GZIP 压缩。 您可以通过直接链接到资产来测试 CDN 提供的资产以进行 GZIP 压缩。

由 CDN 托管的资产的 GZIP 压缩测试
由 CDN 托管的资产的 GZIP 压缩测试

在上面的报告中,可以看到 Kinsta CDN 使用了 KeyCDN 引擎,这是一个传统的拉式 CDN。 如果您使用 Kinsta 托管您的 WordPress 网站,则不必担心 GZIP 压缩,因为它默认启用。

2. “content-encoding: gzip” HTTP 响应头

验证网站是否提供 GZIP 压缩内容的第二种方法是验证content-encoding: gzip HTTP 响应标头。

厌倦了没有答案的 1 级 WordPress 托管支持? 试试我们世界级的支持团队! 查看我们的计划

您可以打开 Chrome DevTools 或 Firefox Developer Tools 并在Network部分下查找此响应标头。

我之前已经在 Chrome DevTools 中展示了它的外观。 这是它在 Firefox 开发人员工具中的外观。

Firefox 开发者工具中的“content-encoding: gzip”标头
Firefox 开发者工具中的“content-encoding: gzip”标头

您还可以在 Chrome DevTools 设置面板中启用“使用大请求行”选项,以查看页面的原始大小和压缩大小。 正如您在下面看到的,在使用 GZIP 压缩后,原始页面的大小从118 KB减少到仅22.9 KB

在 Chrome Devtools 中查看压缩和未压缩的页面大小
在 Chrome Devtools 中查看压缩和未压缩的页面大小

3.网页测速工具

大多数网站速度测试工具都会警告您不要使用 GZIP 之类的压缩来为您的网页提供服务。 许多阅读本文的读者可能正是因为这些 GZIP 警告,其中许多我已经在上面深入讨论过。

各种网页速度测试工具中的 GZIP 警告
各种网页速度测试工具中的 GZIP 警告

您可以使用 PageSPeed Insights、GTmetrix、Pingdom 工具和 WebPageTest 等工具来检查您的 WordPress 网站是否启用了 GZIP 压缩。

如何启用 GZIP 压缩

如果您的 Web 服务器上没有启用 GZIP 压缩,有很多方法可以启用它。 确切的方法取决于您用于托管网站的 Web 服务器。

重要提示:与往常一样,在编辑站点和服务器配置文件之前对其进行备份。

使用 WordPress 插件启用 GZIP

在 WordPress 网站上启用 GZIP 压缩的最简单方法是使用缓存或性能优化插件。

例如,如果您将 WordPress 站点托管在 Apache Web 服务器上,W3 Total Cache 会在其浏览器缓存设置面板下包含一个启用 GZIP 压缩的选项。

同样,WP Rocket 允许您自动添加 GZIP 压缩规则。 这些插件通过将 Apache 的mod_deflate模块添加到 .htaccess 文件来启用 GZIP 压缩。

在 W3 Total Cache 中启用 GZIP 压缩
在 W3 Total Cache 中启用 GZIP 压缩

WordPress 插件需要权限才能修改 Web 服务器上的文件。 如果他们没有正确的权限,那么他们将失败或向您显示错误。

在这种情况下,您需要联系您的托管服务提供商或使用下面的代码片段手动修改您的网络服务器的配置文件。

注意: Kinsta 已针对高性能、可靠性和安全性优化其平台。 这还包括默认为其所有托管计划启用 GZIP 压缩。

由于第三方缓存插件可能会与 Kinsta 的内部性能优化发生冲突,因此 Kinsta 不允许在其服务器上使用大部分缓存插件。 有关更多信息,您可以查看 Kinsta 禁用插件的完整列表。

在 Apache Web 服务器上启用 GZIP

根据 Netcraft 的说法,Apache 提供的活动站点比当今使用的任何其他 Web 服务器都多。 它也是 WordPress 推荐的两个 Web 服务器之一。

要在 Apache 服务器上启用 GZIP 压缩,您需要使用其mod_filtermod_deflate模块并使用正确的指令正确配置它们。 他们将指示 Apache 在通过网络将其发送到客户端之前压缩服务器输出。

您有两个选项可以根据您拥有的访问级别来编辑 Apache 的服务器配置:

  1. 如果您可以访问主服务器配置文件(通常称为httpd.conf ),建议您使用它来配置 Apache,因为.htaccess文件会降低 Apache 的速度。
  2. 如果您无法访问主服务器配置文件(大多数 WordPress 共享主机提供商通常都是这种情况),那么您需要使用.htaccess文件配置 Apache。

第一个选项仅限于系统管理员,因为托管服务提供商很少允许您编辑主服务器配置文件。 解释如何做到这一点超出了本文的范围。 您可以参考 HTML5 Boilerplate 项目和 Apache 文档共享的示例 Apache Server Configs 以开始使用。

第二个选项是大多数 WordPress 网站所有者的理想选择,因为许多共享托管服务提供商允许您编辑.htaccess文件。

要开始使用,请使用 SFTP 或主机的在线文件管理器在 WordPress 站点的根目录中查找.htaccess文件。 然后将以下代码片段添加到其中。

重要提示:确保mod_filter模块在您的服务器上处于活动状态。 大多数网络主机默认启用它,但如果没有启用, AddOutputFilterByType指令将不起作用,并可能引发 HTTP 500 错误。 如果在添加下面的代码段后有任何问题,您可以查看服务器的错误日志。

 <IfModule mod_deflate.c> # Compress HTML, CSS, JavaScript, Text, XML and fonts AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE application/x-font AddOutputFilterByType DEFLATE application/x-font-opentype AddOutputFilterByType DEFLATE application/x-font-otf AddOutputFilterByType DEFLATE application/x-font-truetype AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE font/opentype AddOutputFilterByType DEFLATE font/otf AddOutputFilterByType DEFLATE font/ttf AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE image/x-icon AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/xml # Remove browser bugs (only needed for ancient browsers) BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html Header append Vary User-Agent </IfModule>

仅在.htaccess文件的现有指令之后添加上面的代码。 保存文件,然后检查它是否在您的服务器上启用 GZIP 压缩。

启用 GZIP 压缩后的 Apache .htaccess 文件示例
启用 GZIP 压缩后的 Apache .htaccess 文件示例

您的 Web 服务器现在应该为上面列出的所有文件扩展名提供压缩文件。 您可以使用前面提到的任何方法来确认这一点。

如果您想确保客户端的代理和安全软件不会干扰 GZIP 压缩,您可以将上面的代码片段替换为下面的代码片段。

 <IfModule mod_deflate.c> # force compression for clients that mangle 'Accept-Encoding' request headers <IfModule mod_setenvif.c> <IfModule mod_headers.c> SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding </IfModule> </IfModule> # compress all output with one of the following file extensions <IfModule mod_filter.c> AddOutputFilterByType DEFLATE "application/atom+xml" \ "application/javascript" \ "application/json" \ "application/ld+json" \ "application/manifest+json" \ "application/rdf+xml" \ "application/rss+xml" \ "application/schema+json" \ "application/geo+json" \ "application/vnd.ms-fontobject" \ "application/wasm" \ "application/x-font-ttf" \ "application/x-javascript" \ "application/x-web-app-manifest+json" \ "application/xhtml+xml" \ "application/xml" \ "font/eot" \ "font/opentype" \ "font/otf" \ "font/ttf" \ "image/bmp" \ "image/svg+xml" \ "image/vnd.microsoft.icon" \ "text/cache-manifest" \ "text/calendar" \ "text/css" \ "text/html" \ "text/javascript" \ "text/plain" \ "text/markdown" \ "text/vcard" \ "text/vnd.rim.location.xloc" \ "text/vtt" \ "text/x-component" \ "text/x-cross-domain-policy" \ "text/xml" </IfModule> # define and map media types to their appropriate encoding type # Using SVG format (Scalable Vector Graphics) is highly recommended to # load logos, icons, text, and simple images. You can compress .SVG files # further using GZIP to create .SVGZ files. However, most browsers don't # know that they need to decompress them first if they're not served # without an appropriate 'content-encoding' HTTP response header. Thus, # these images wouldn't show up in the browser. Hence, this module. <IfModule mod_mime.c> AddType image/svg+xml svg svgz AddEncoding gzip svgz </IfModule> </IfModule>

您可以通过访问其代码存储库并关注其中链接的所有资源来了解有关此处使用的所有指令的更多信息。

在 Nginx Web 服务器上启用 GZIP

根据 Netcraft,Nginx 是面向 Web 的计算机最常用的 Web 服务器。 如果目前的趋势继续下去,它很快就会超过 Apache,成为活跃站点使用最多的 Web 服务器。 甚至 Kinsta 也使用 Nginx 为其性能优化的 WordPress 托管解决方案提供支持。

您可以使用 ngx_http_gzip_module 中定义的指令在 Nginx Web 服务器上启用 GZIP 压缩。

首先,将下面给出的指令添加到您的nginx.conf文件中。 通常,您可以在服务器的/etc/nginx/nginx.conf位置找到此文件。

 # enables GZIP compression gzip on; # compression level (1-9) # 6 is a good compromise between CPU usage and file size gzip_comp_level 6; # minimum file size limit in bytes to avoid negative compression outcomes gzip_min_length 256; # compress data for clients connecting via proxies gzip_proxied any; # directs proxies to cache both the regular and GZIP versions of an asset gzip_vary on; # disables GZIP compression for ancient browsers that don't support it gzip_disable "msie6"; # compress outputs labeled with the following file extensions or MIME-types # text/html MIME-type is enabled by default and need not be included gzip_types application/atom+xml application/geo+json application/javascript application/x-javascript application/json application/ld+json application/manifest+json application/rdf+xml application/rss+xml application/vnd.ms-fontobject application/wasm application/x-web-app-manifest+json application/xhtml+xml application/xml font/eot font/otf font/ttf image/bmp image/svg+xml text/cache-manifest text/calendar text/css text/javascript text/markdown text/plain text/xml text/vcard text/vnd.rim.location.xloc text/vtt text/x-component text/x-cross-domain-policy;

如果您的站点提供大型 JS 和 CSS 文件,则可以通过将以下指令添加到nginx.conf文件来增加用于压缩的缓冲区大小:

 # sets the 'number' and 'size' of buffers for GZIP compression # default buffer size is 4K or 8K depending on the platform gzip_buffers 16 8k;

保存nginx.conf文件后不要忘记重新加载 Nginx。

 sudo service nginx reload

最后,您应该测试一下您的服务器是否启用了 GZIP 压缩。 您可以参考 Nginx 文档以获取所有ngx_http_gzip_module指令的最新列表。

在 IIS Web 服务器上启用 GZIP

Microsoft 的 Internet 信息服务 (IIS) 是当今使用的第三流行的 Web 服务器。 IIS 主要部署在运行于 Windows 上的企业环境中,尤其是用于设置公司特定的内网和外网服务器。

由于各种兼容性问题,它很少用于托管 WordPress 网站。

然而,如果您发现自己处于需要在 IIS 上启用 GZIP 压缩的罕见情况之一,您可以参考 Microsoft 的文档以开始使用。 您可能还会发现这个 Stack Overflow 线程很有帮助。

GZIP 压缩的替代方案

网络上的数据压缩世界一直在进步。 随着平均页面权重大小的不断增加,网络技术也在努力追赶它,以提高通过网络传输数据的效率。

页面权重随时间增加(来源:HTTPArchive)
页面权重随时间增加(来源:HTTPArchive)

在过去的几年里,一种新的压缩算法得到了广泛的普及:Brotli。 压缩 WOFF2 网络字体最初是 Brotli 的主要关注点,但后来扩展到支持任何类型数据的压缩。

Brotli 比 GZIP 更好地压缩数据,但它需要更多的时间和资源来压缩数据。 但是,它的解压时间与 GZIP 相当,但还是慢了一点。

跨各种浏览器的 Brotli 支持
跨各种浏览器的 Brotli 支持

今天大多数浏览器都支持 Brotli,但在 WordPress 网站上使用它仍然有些复杂。 您必须使用支持 Brotli 或允许您安装 Brotli 库的托管服务提供商托管您的网站。 大多数托管 WordPress 主机还不完全支持它,但如果您使用 CDN,例如 Cloudflare 或 KeyCDN,您可以轻松启用它。

Brotli 在压缩静态资产方面表现出巨大的潜力。 Akamai 发表了一篇比较 Brotli 与 GZIP 的详细文章。 您可以查看它以了解有关 Brotli 的更多信息。

准备好加速您的网站了吗? ️ 在您的 Web 服务器上启用 GZIP 压缩是实现这一目标的最简单和最有效的方法之一。 通过这个分步演练了解如何 ️ 点击推

概括

一个优化良好的网络对每个人都有好处。 用户喜欢更快的网站,网站所有者喜欢降低的托管费用,而网络主机喜欢在其服务器上实现的优化。 GZIP 等压缩技术是加快访问者页面加载时间的最佳方法之一。

WordPress 网站所有者可以通过启用 GZIP 压缩来立即加速他们的网站。 Kinsta 默认在其所有服务器上启用它,但对于其他服务器,本文介绍了在各种 Web 服务器上启用 GZIP 压缩的多种方法。

速度对于任何网站都至关重要。 只是压缩!