如何使用插件使您的 WordPress 网站加载更快

如果您想吸引读者的注意力，拥有一个包含大量精彩内容的漂亮网站非常重要。 不幸的是，如果您的页面加载速度太慢，读者可能永远看不到您的内容。 为什么？ 您只有几秒钟的时间来吸引他们的注意力并阻止他们转移到下一个站点。 读者不想等待您的内容加载。 等待的时间越长，您失去它们的可能性就越大。

因此，优化页面加载速度非常重要。 在线有几个很好的工具可以帮助您测量速度和解决问题。 最受欢迎的工具之一是 Google PageSpeed Insights。

PageSpeed 见解

Google PageSpeed Insights 是一款免费使用的在线工具，可以测试任何网站的加载速度、识别问题、确定问题的优先级，并提供解决这些问题的建议。

对于这篇文章，我使用我自己的网站，它使用来自 Elegant Themes 的 Divi 作为基本博客。 我正在展示需要修复的内容、该工具提出的建议以及我如何修复它们。 该分数给出了移动和桌面的结果。 我专注于桌面。 一些移动问题将在此过程中得到解决。

大多数这些问题将通过使用插件来解决。 在决定插件时，请坚持使用最近更新并具有良好声誉的插件。 许多插件将解决不止一个问题。

提醒一句——有些插件不能很好地与其他插件配合使用，因为它们都试图做同样的工作。 这可能与想要的效果不同。 我建议在您的主站点上使用它们之前在测试站点上试用它们。 不仅是插件本身，还有插件组合。 在您的实时站点上尝试插件之前，请确保您有最近的备份。

我的分数

我的分数是可怕的 46 。 首先要注意的是结果中有三个不同的部分：

• 应该修复（2 项）
• 考虑修复（6 项）
• 通过（2 项）

每个部分都会展开以显示问题所在，并就如何解决这些问题提供建议。 我发现最好从第一个项目开始并按顺序进行。 按顺序解决它们也将解决列表中的其他问题。

注意——我什至在此过程中遇到了一些失败。 我将它们包括在内，以便您了解可能存在的问题。

应该修复

我有两个需要立即关注的项目：

• 启用压缩
• 消除首屏内容中的渲染阻塞 JavaScript 和 CSS

启用压缩

我最重要的问题是我没有使用压缩。 它表明我可以将文件传输大小减少 79%。 这可以使用 gzip 或 deflate 来完成。

WP 性能得分助推器

这个免费的插件具有 gzip 压缩，并且将通过删除查询字符串、添加变量：accept-encoding 标头和设置过期缓存来解决其他几个问题，例如 CSS 和 JavaScript 问题。 我选择它是因为它的 4.7/5 有超过 10,000 次活动安装。 它的开发是为了加快页面加载和改进页面分数测试。

这给了我一个 78 分的消息，以减少服务器响应时间。 这与我的托管计划有很大关系。 我正在通过将我的网站移至新的托管计划来解决此问题。 这超出了本文的范围。

一个很酷的事情是它解决了下一个问题的一些主要问题：消除首屏内容中的渲染阻塞 JavaScript 和 CSS。 此问题现已移至考虑修复。 它还完全修复了 Leverage Browser Caching。 该网站现在通过了 4 条规则，而之前只通过了 2 条。

减少服务器响应时间

奇怪的是服务器响应时间从 0.96 上升到 1.4。 减少服务器响应时间现在在应该修复中。 这需要一个缓存插件。

W3 总缓存

W3 Total Cache 是迄今为止最流行的加速网站服务器性能的插件。 它有近一百万的活跃安装，评分为 4.4/5。 它通过缓存优化您的网站。 您可以单独选择不同的缓存选项。 它们包括页面、数据库、对象和浏览器。 它将缓存未来过期的标头和实体标签、提要和搜索结果。 它还具有缩小 JS、CSS 和 HTML 的功能。 完全配置后，它将使您的 Google PageSpeed 得分至少提高 10 倍。

我在打开所有缓存功能的情况下进行了尝试。 这使我的分数达到 86 。 我的网站第一次处于绿色状态，我遇到的所有问题都在考虑修复。 它现在通过了 5 条规则，包括服务器响应时间，现在说“服务器响应迅速”。

考虑修复

当我第一次运行测试时，这部分的问题比我最终得到它时要多。 当我在“应该修复”区域修复问题时，其中许多问题都得到了解决。

最初包括的问题：

• 利用浏览器缓存
• 服务器响应时间
• 缩小 JavaScript
• 优化图像
• 缩小 CSS
• 缩小 HTML

以下是当前存在的问题。

消除首屏内容中的渲染阻塞 Javascript 和 Css

首屏的 JavaScript 和 CSS 可以通过在浏览器上放置过多的负载来减慢页面加载速度。 它们必须先加载，然后才能加载折叠上方的其他任何东西。

有几种方法可以修复它：

• 延迟加载
• 异步加载
• 将它们直接内联到 HTML

这是我用来解决此问题的插件。

自动优化

该插件将缩小（删除所有不必要的格式并减小文件大小并在浏览器上加载）并压缩您的 JavaScript、CSS 和 HTML。 它将添加过期标头并缓存它们。 它会将您的样式移动到页眉并将脚本移动到页脚。 使用高级设置，您可以根据您的特定需求对其进行调整。

这也将解决一些问题，例如缩小列表中的 JS 和 CSS。

起初我只是打开了 HTML、JS 和 CSS 的基本设置。 这使我的分数达到 88 ，并将问题减少到 3 个 CSS 资源。 一个是由插件本身创建的，另外两个是谷歌字体。 它现在通过了 7 条规则。 它解决了 Minify CSS 和 Minify HTML。

更好的 WordPress 缩小

这个插件的主要目的是缩小你的 CSS 和 JS，但它还有一个很酷的功能，可以让你将文件移动到页脚或其他位置（这就是我选择它的原因）。 它使用排队系统来提高与浏览器、插件和主题的兼容性。

当我安装它时，我的主题的所有布局设置都被删除，我的所有菜单、图像、链接等都出现在屏幕的最左侧。 幸运的是，当我卸载它时，格式返回了。 这可能是设置中需要调整的东西。 我确信这是一个很好的插件，因为它有超过 60,000 次活动安装和 4.4/5 的评分。 我只包含这个作为警告，如果没有一些设置，它可能无法按照您需要的方式工作。

因为我的分数是 88 并且我知道这 3 个问题是什么，所以我决定继续下一个问题。

优化图像

图像大小在页面加载速度中起着重要作用。 有时，您可以使用更小的图像尺寸和更低的质量，而在 Web 上查看时不会有太大的视觉差异。 这不仅加快了加载时间并使用更少的带宽，而且还加快了备份时间并减少了服务器上的存储空间。

EWWW 图像优化器

这个插件会在你上传图片时自动优化你的图片，并将你的图片转换为产生最小尺寸的格式。 它还将优化您已经上传的图像。 您还可以让它对 PNG 和 JPG 图像应用有损减少。

当我安装它时，它希望我找到并安装几个文件。 我认为这个插件适用于所有安装的文件，但我决定找到一个开箱即用的插件。

WP Smush

该插件将在不降低质量的情况下减小图像的文件大小。 它通过去除隐藏信息来做到这一点。 它将分析您的文件并告诉您需要删除多少图像。 您可以将它们大量涂抹。

免费版不会压缩超过 1 MB 的任何内容，一次只能压缩 50 个。 不仅如此，您还需要 WP Smush Pro，它可以将图像压缩到 32 MB，一次没有数量限制。 如果您需要，它会备份原件。 价格从每月 19 美元起。

我有 114 张图像需要处理。 其中 8 张图片超过 1 MB。 我决定手动修复这些。 它粉碎了 98 张图像并将文件大小减少了 4.79 MB (8.82%)。

这使我的分数达到了 90 。 Google Insights 确定了 5 张它不喜欢但没有超过 1 MB 的图片。 它们的范围从 0.7 KB 到 17 KB。

手动优化图像

您可以通过调整大小、降低质量和更改格式来手动优化图像。 我最喜欢和最常用的处理图像的工具之一是 Paint.NET。 这是一款适用于 Windows 的免费图像和照片编辑应用程序，具有许多减小文件大小的功能。 你最喜欢什么？

缩小 JavaScript、CSS 和 HTML

我以为我解决了这个…

当我处理其他问题时，我看到唯一要缩小的消息是 JavaScript。 一旦我优化了我的图像，所有三个问题都会返回。 我回溯我的脚步，想知道发生了什么。

通过尝试 Better WordPress Minify 然后将其关闭，我缩小 CSS 和 HTML 的消息又回来了。 我的分数下降到 88 分，现在我又回到了 5 条通过规则的状态。 我打开了 W3 Total Cache 的缩小功能，现在它通过了所有缩小问题。 我现在的分数是 88，它通过了 8 条规则。 此外，它还有六个文件。 我知道我已经解决了其中的一些问题，所以我一定改变了一些东西。

我进行了一些故障排除，发现当我早些时候遇到 Better WordPress Minify 的问题时，我已经关闭了 Autoptimize。 我重新打开了自动优化，从 W3 Total Cache 中关闭了 minify，并清除了缓存（非常重要的一步！）。 我现在得到了 90 的分数，并且该网站通过了 8 条规则。 它回到了首屏的三个 CSS 文件和优化图像的消息。

根据我过去的经验，我决定不在这些文件上浪费时间。 我认为谷歌讨厌任何尺寸的图像（无论我得到它们多小，我仍然会收到减小尺寸的消息）并且从 46 到 90 的 PageScore 是我书中的胜利。 我已经学会了在你领先时停下来的艰难方法。

最终得分

我的最终分数是 90/100。 我用来获得这个分数的插件是：

• 自动优化（打开所有功能）
• W3 Total Cache（仅开启页面缓存功能）
• WP Performance Score Booster（所有功能已打开）
• WP Smush（免费版）

根据记录，移动分数从 36 到 78。要修复它，我必须针对移动优化我的图像和文件。

最后的想法

您的访问者、Google 和其他搜索引擎讨厌加载缓慢的网站。 使用 Google PageSpeed Insights，您可以准确了解问题所在，并获得有关如何解决这些问题的提示。 从谷歌讨厌的慢速网站到谷歌喜欢的快速网站，你只需要几个免费插件。 只是要小心试验——有些插件不能很好地与其他插件配合使用。

我想听听你的意见。 您是否使用 Google PageSpeed Insights 优化了您的 WordPress 网站？ 你的经历和我一样吗？ 您是否使用不同的插件来解决问题？ 我想在评论中听听你的经历。