网站速度优化初学者指南 修复慢速网站

不确定如何提高网站的整体速度？

网站速度是现代 SEO 的基础部分，相信我； 它对排名有直接而显着的影响。

如果您曾经访问过我的网站 TheGuideX，您会注意到我的网站加载时间不到 1 秒（我还在下面附上了 GTmertix 结果）。

根据 GTmetrix，TheGuideX.com 的 PageSpeed 得分为 100%，YSlow 得分约为 95%，加载时间为 0.9 秒，只有 23 个 HTTP 请求。 这是惊人的。

…这是 TheVPNCoupon.com 的另一份报告，我在该网站上发布了有关 VPN 的博客。

根据 GTmetrix，我的另一个博客 (TheVPNCoupon.com) 的 PageSpeed 得分约为 99%，YSlow 得分为 95%，有 23-HTTP 请求，而且这个网站的加载时间也低于 1 秒（尽管加载这个只需要 800 毫秒）网站）。

加载时间低于 2 秒的网站被认为是可接受的加载速度。 但我们始终建议您尽可能优化您的网站，以获得更好的加载速度。

那么我该怎么做才能优化我的网站速度呢？ 它是否需要任何技术或开发技能来优化您的网站？

答案是不; 您不需要任何技术或开发技能来优化您的网站。 您可以使用一些 WordPress 插件和 CDN 轻松完成。 为了优化您的网站，首先，您需要一个更好的网络托管计划。

大多数业余博主在这里都失败了，当他们要求我优化他们的网站时，我注意到他们在他们的网站上使用廉价的共享托管计划，而使用廉价的托管计划永远无法使网站快速运行。

如果您对 VPS 有基本的了解，我建议您首先将您的网站转移到 DigitalOcean 或 Cloudways，如果您想要基于 cPanel 的托管，您可以更改为 SiteGround。

此外，请确保在您的网站上使用 CDN。 如果您正在寻找免费的 CDN 提供商，那么我会向您推荐 Cloudflare。 您还可以将 ImageKit 用于图像 CDN（我在我的网站上使用它，它可以帮助我实时优化图像）。

在我们深入研究速度优化技术之前，首先我们学习

为什么速度很重要？

那么您等待网站加载多长时间？

好吧，根据统计数据，我们中的一半人，即使是我，我也不想等待两秒钟让网站加载。

这就是为什么我想确保我的网站在一秒钟内或尽可能快地加载。 今天，我将分享完全相同的方法，我在我的网站上使用它来优化它的速度。

但是为什么网站的速度很重要？ 几分之一秒有什么不同？

答案？ 它有很大的不同！

但它如何产生很大的不同？ 让我们看一份详细的报告，以了解有关速度为何重要的更多信息。

1. 缓慢的网站会扼杀转化：

缓慢的网站可能会扼杀您的网站转换。

让我们想象一下，如果您是一个电子商务网站，并且您的网站加载大约需要四秒钟。 根据各种报告，如果加载时间超过 3 秒，40% 的人会离开您的网站。

因此，从这个意义上说，如果您的网站每月收到大约 1,00,000 次访问量，并且加载您的网站大约需要四秒钟，那么有多达 40,000 人可能会放弃您的网站。

这样一来，您将失去 40% 的用户，因此也会影响网站的整体转化率。 这样，网站速度对于提高转化率非常重要。

2. 我们期望速度和用户体验：

正如我上面已经提到的，如果加载时间超过三秒，40% 的人会离开你的网站。 说到我，我总是离开网站，加载需要两秒或更长时间。

WTH 等待两秒钟加载网站？

如果我不能等待两秒钟，那我就不能指望我的读者停留这么久。

良好的用户体验涉及两个主要因素：

1. 为访问者提供他们正在寻找的东西，以及
2. 快给他们。

以下是有关 Google 新页面体验的更多排名因素，您可以考虑在您的网站上进行优化。

一旦访问者感到困惑和沮丧，就意味着我们做错了什么，没有什么比加载时间慢更令人沮丧的了。

如果您真的想提高网站的整体性能，那么网站加载速度应该是您的首要任务。

3. 网站速度影响您的 Google 排名：

最后但并非最不重要的一点是，它在谷歌排名中占主导地位。

谷歌已经承认他们正在努力让整个网络变得更快。 他们的使命是使网站超级快速、更可靠、更有用。

没有良好的加载速度是不可能的，他们优先考虑加载速度快的网站。 据我所知，他们在 2010 年宣布，他们会稍微偏爱加载速度快的网站。

根据 SERoundtable 的报告，如果你的网站加载内容的时间超过 2 秒，那么谷歌可能会限制它发送到你网站的爬虫数量。

如果您的网站属于这种情况，那么 Google 不太可能更喜欢并获取您的最新博客文章或注意到任何最近的更新。 它肯定会损害您的网站。

所以速度很重要，它会影响您的网站转换； 它影响用户体验，也影响搜索引擎排名。

到目前为止，我相信您已经了解了快速加载网站的重要性。

现在，在我们继续使用特定技术来帮助您优化网站的整体速度之前，让我们花点时间来回顾一下可以帮助您分析网页速度的工具。

网站速度测试工具

好的，所以网站速度优化很重要！ 现在，你怎么知道你在哪里？

也就是说，您的网站速度慢吗？ 是在中间，还是快如闪电（那么恭喜，您可能可以停止阅读了！）。

唯一知道的方法是测试您的网站。 有很多网站可以衡量我们的网站速度，但在本指南中，我只会分享一些我个人喜欢使用的工具。

1.GTmetrix

GTmetrix 是检查网站性能的最佳工具之一。 该工具对于临时用户和开发人员来说是一个不错的选择。

GTmetrix 提供了用户友好的设计和一系列有用且深入的优化。 要使用此工具，只需放置一个网站链接，然后单击“分析”按钮。

当您单击“分析”按钮时，需要几秒钟甚至一分钟的时间才能对您的网站进行详细分析。

如果您深入了解 GTmetrix 结果并展开“推荐”部分，它将显示针对您网站的推荐。 您也可以点击“这是什么意思？” 了解有关这些错误和优化的更多信息。

除了“建议”之外，它还显示您的网站使用的每个外部和内部文件的 DNS 查找时间。 如果您是开发人员或具有技术技能，它将帮助您进一步优化您的网站。

2. Pingdom

Pingdom 是另一个最有效和最伟大的 WordPress 速度优化工具。 如果您是初学者或开发人员，此工具将帮助您有效地测试您的网站并帮助您提出优化网站的建议。

要使用此工具，请输入您的网站地址，然后选择“测试位置”。 选择测试位置后，单击“开始测试”按钮，它将开始分析页面。

与 GTmetrix 类似，如果您深入挖掘，它会向您展示各种优化您的网站的建议。 再往下，您可以找到有关您网站上的特定请求和瀑布分析的信息。

该工具对于即兴网站速度非常有帮助 - 但它需要一些高级知识才能从中受益。 您还可以阅读 KeyCDN 发布的有关瀑布分析的帖子，以了解更多信息。

3. 谷歌 PageSpeed Insights

另一个测试您的网站的最佳工具是 Google 的 PageSpeed Insight。 该工具只是为您提供优化网站的建议，但不会分享您网站的速度测试结果。

不过，情况发生了变化。 现在，Google 将共享First Contentful Paint (FCP)和DOM Content Loaded (DCL)的页面加载时间。 您可以在此处的 Google 官方开发者页面上了解有关这些速度指标的更多信息。

如果您的页面速度得分较低并且加载时间很短，那么本指南适合您！ 您可以一直阅读本指南，以在 Google PageSpeed Insight 和其他网站上正确优化您的网站。

您还可以查看我们关于解决 Flash of Invisible Text (FOIT) 的其他指南，以优化您网站的字体。

4.网页测试

最后但并非最不重要的用于检查网站速度的工具是 WebPageTest。 就功能深度和它提供的数据而言，该工具是最先进的 WordPress 速度测试工具之一。

当您使用 WebPageTest 工具检查您的网站速度时，您可以使用一些高级设置来分析您的网站。 您可以使用这些高级设置来；

如果您查看来自 Google 搜索的 John Mueller 的这条推文，他还推荐使用 WebPageTest 工具来检查网站加载速度。

如果您对这些选项感到困惑，我建议您尝试“简单测试”选项卡。 总体而言，此工具最适合测试您的网站速度，如果您是开发人员，它将对您修复网站有很大帮助。

到目前为止，我们已经了解了拥有快速加载网站的重要性以及检查网站速度的工具。

现在，是时候分享正确优化网站的技术了。

在本教程中，我不仅会分享使用缓存插件优化 CSS、JS、HTML 或像其他人一样使用 CDN 的步骤，还会分享最容易进行这些优化的方法正确。

这些方法简单明了，有例子；

但在继续使用这些方法之前，我建议您首先使用 Updraft Backup 插件备份您的 WordPress 网站，该插件可在 WordPress 存储库免费获得。

备份 WordPress 网站后，我们可以继续优化网站。

那么如何...

优化您的网站

现在等待结束了！

在这里，我将分享我一直在我的网站上使用的方法来优化它。 您可以使用相同的技术来优化您的博客、微利基以及您的电子商务商店。

1. 选择快速且值得信赖的虚拟主机

因此，第一步是选择一个值得信赖且快速的网络托管服务提供商。

正如我已经提到的，当人们要求我优化他们的网站时，我注意到他们在他们的网站上使用廉价的共享托管计划，而使用廉价的托管计划永远无法使网站快速运行。

因此，如果您使用任何便宜的共享托管计划，那么我肯定会建议您首先从当前的网络托管服务提供商转移到任何受信任的提供商。

如果您要求我提供一个快速且最佳的网络托管平台，我将始终推荐 DigitalOcean – 但它需要一些技术技能来管理您的 DigitalOcean droplet。 尽管它很简单，而且为了更方便，您可以使用服务器上的任何控制面板（我个人在所有项目中都使用 DigitalOcean）。

这些面板可以包括 ServerPilot、VestaCP 等等——但我始终建议使用 ServerPilot，因为它是安装 WordPress 最简单的控制面板之一（您可以单击此处在 ServerPilot 上获得 10 美元的免费信用额度）。

如果您是初学者并且想要基于 cPanel 的主机，那么您也可以使用 SiteGround。 SiteGround 是小型企业和网站的最佳和值得信赖的网络托管服务提供商之一。

1.1 推荐主机

1.2 不推荐托管

2.选择优化的WordPress主题

为您的 WordPress 网站选择主题时，必须选择一个针对速度进行了优化的主题。 一些漂亮且令人印象深刻的主题编码不佳，可能会使您的网站变得非常缓慢。

如果您没有在您的网站上使用优化的主题，那么这些速度优化方法对您有用的机会就更少了。

我通常更喜欢使用具有简单干净 UI 的主题，而不是喜欢一些华丽的、巨大的动画和具有复杂布局的主题。 您始终可以使用可靠且优质的 WordPress 插件添加这些功能。

如果您需要任何主题推荐，我建议您更喜欢 StudioPress、MyThemeShop 和 GeneratePress 的高级 WordPress 主题。 这些市场的主题针对速度和 SEO 进行了优化和编码。 （我个人更喜欢在我的网站上使用 GeneratePress 主题）

您还可以查看 Astra，这是另一个针对速度和 SEO 优化的主题。 与 GeneratePress 类似，此主题也带有许多自定义选项，并且是 WordPress 存储库中下载次数最多的主题之一，活动安装量超过 70 万。

2.1 推荐主题

到目前为止，我们已经讨论了值得信赖的快速网络托管服务提供商和快速可靠的 WordPress 主题。

这两件事对于进入第三步至关重要，即使用一些 WordPress 插件优化您的博客/网站。

3. 使用 WordPress 插件进行优化

因此，在我们讨论使用一些插件优化您的 WordPress 网站之前，我们假设您已经处理了两件事；

如果您勾选这两个框，您可以使用各种插件进行 WordPress 优化，并探索全面的方法来加快您的网站加载速度。

3.1 使用 WP Rocket 优化您的网站

所以我们用于 WordPress 速度优化的第一个插件是 WP Rocket。

WP Rocket 是最好的 WordPress 缓存插件之一，它有助于加快您的网站加载速度。 它是一款适合初学者的工具，具有大量自定义功能，只需单击几下即可提高您网站的性能。

该插件可以帮助您优化；

所以现在，我们已经了解了使用这个插件的基础知识。 现在我们将向您展示如何使用 WP-Rocket 缓存插件正确优化您的网站。

如果您使用任何其他缓存插件，我几乎不会建议您转向 WP-Rocket。

它是最简单但最好的缓存插件之一，即使您不需要像使用其他缓存插件那样搞乱它们的设置。 只需单击一下，您就可以开始了。

所以…

如何有效使用 WP-Rocket？

您会在 WP-Rocket 插件中找到许多功能，您是否想过您必须在您的网站上激活哪些设置以使其快速运行？

在 WordPress 网站中安装并激活 WP-Rocket 插件后，转到“设置”>“ WP Rocket ”以打开配置页面。

现在，单击“缓存”设置以使用 WP-Rocket 插件设置网站缓存。 （它会显示这样的东西）

首先，您必须启用“移动缓存”，如果您正在为电子商务设置缓存，则启用“登录用户缓存”设置。

然后将“缓存寿命”设置为“ 10 小时”。

完成缓存设置后，我们将移至“文件优化”，我们可以在其中缩小 HTML、CSS、JS、延迟 JS 和合并 CSS 和 JS。

这些设置是 WP-Rocket 最重要的设置之一。 它还将通过结合您网站的 CSS 和 JS 来帮助您减少 HTTP 请求。

当您单击“文件优化”部分时，您将获得各种选项来缩小 HTML、CSS、JS 并将它们组合到更少的文件中。

在“基本设置”中，选中“缩小 HTML”、 “合并 Google 字体文件”、 “删除查询字符串”这三个选项。 它不会影响您的网站——但是当您激活“ CSS 文件”和“ JS 文件”设置时，请确保它不会破坏您的网站。

现在检查CSS 文件中的“缩小 CSS”、“组合 CSS”和“优化 CSS 交付”选项，以缩小 CSS 并将它们组合成更少的文件。 它还将解决您网站上的“消除渲染阻塞 CSS ”问题。

同样，在JS Files部分中，单击“Remove JQuery Migrate”、“Minify JS”、“Combine JavaScript Files”、“Load JavaScript Deferred”，然后在 JS deferred 部分下启用“Safe Mode for JQuery”。

在文件优化中完成这些设置后，请清除缓存并确保它不会通过访问主页或网站的任何页面来破坏您的网站。

在文件优化设置之后，您将获得管理延迟加载和媒体的设置。 单击媒体选项以更改媒体设置；

在此选项中，您将获得在图像和视频上启用延迟加载的选项，您还将获得禁用嵌入、表情符号和启用 WebP 兼容性的选项。

我建议您启用图像、iframe 和视频的延迟加载设置。 您还可以将 YouTube 视频或 iframe 替换为图像（相信我，它会让您的网站快速运行）。

您还将获得禁用表情符号和嵌入的选项，大多数这些对我们没有用，并且通过禁用嵌入，您将节省您的网站资源，因此我建议您启用这些设置。

媒体设置后，您将获得在您的网站上启用预加载的选项。

为什么现金预加载对于提高网站性能至关重要？

预加载可确保您的访问者立即获得更快的缓存版本。 WP Rocket 会自动处理此问题，您的主页和在其上找到的所有链接都将被预加载

完成预加载设置后，您将获得配置高级设置的选项。 从高级设置中，您可以轻松管理一些设置，包括禁用自定义 URL 或自定义 cookie、用户代理的缓存以及清除所需的 URL。

在此之后，您将获得管理数据库优化和 CDN 的选项，但我们将在此处跳过此设置。 我们使用WP-Optimize插件来有效地优化数据库，我们将在后面的 CDN 部分向您展示如何实现 CDN。

同样，在这些设置之后，您将获得一个管理 WordPress Heartbeat API 的选项。 基本上，WordPress Heartbeat API 为服务器和浏览器之间的实时数据传输和同步提供了连接。

仍然无法理解心跳设置？ 这里我分享几个涉及心跳设置的例子；

如果您使用的服务器资源较少，您可以禁用它以节省资源，但对于小型网站，这不是主要问题。

现在，WP-Rocket 插件中最后但并非最不重要的设置是它们的附加设置。 如果您在您的网站上使用 Facebook Pixel 和 Google Analytics，它将帮助您将它们本地存储在您的服务器上以优化网站速度。

您可以简单地启用它来改善您网站上的 Leverage 浏览器缓存问题。

另一个很棒的插件可以包括直接从 WP-rocket 仪表板将您的网站与Cloudflare 和 Sucuri集成。 每当您清除网站上的内容时，它将帮助您清除和清除这些 CDN 提供商上的缓存。

相信我; 这些是使您的网站真正快速的最佳设置之一。 如果您想让您的网站快速加载，我建议您启用这些设置。

截至目前，我们已经使用 WP-Rocket 插件实现了一些优化。

现在我们将使用其他一些插件，如 WP-Optimize 用于数据库优化和 AssetCleanUp Pro 用于进一步的速度优化。

3.2 使用 Asset CleanUp Pro 优化您的网站

一旦您使用 WP Rocket 优化了您的网站并检查了 GTmetrix 和 Pingdom 结果，您将看到页面加载速度的即时改进。

但是我们还没有在这里完成，我在上面已经提到我们必须尽可能优化我们的网站。

因此，现在我们将使用其他一些插件，例如 Asset CleanUp Pro 来进一步优化我们的网站（您也可以使用 Asset CleanUp 的免费版本进行优化，但我建议您购买付费版本）。

该插件可以帮助您修复网站上的Flash of Invisible Text (FOIT)问题，它还可以阻止对XML-RPC 文件的访问并做更多的事情。

由于我们已经使用 WP Rocket 优化了我们的网站，因此 HTML、CSS 和 JS 以及其他一些设置的修改被阻止，我们无法启用它们（这是一件好事！）

启用测试模式后，现在单击优化 CSS选项，然后向下滚动到缓存动态加载 CSS设置，然后启用它。

完成后，单击“保存”按钮。

同样，在优化 JS 部分中，启用缓存动态加载的 JavaScript。

这些选项将帮助您缓存 CSS 和 JS 的动态值。 虽然，使用 WP-Rocket 后，您不会在 WordPress 中遇到这些问题。

完成这些设置后，点击“ CDN ”选项后的“ Site-Wide Common Unloads ”设置。

在这里，您会找到一些禁用Emojis 、 Embeds 、 Dashicons 、 Gutenberg CSS Block Library 、 JQuery Migrate和Comment Reply Site-wide 的选项。

但是，如果您没有在博客上使用 Gutenberg，Dashicons 图标，那么您可以禁用它们。

而且，如果您不将 WordPress 用作博客，不希望访问者留下评论，或者您已将默认 WordPress 评论替换为 Disqus 或 Facebook 等评论平台，那么您还可以禁用“评论回复站点-宽“从设置。

现在，我们将转到“ HTML Source Cleanup ”部分，我们可以从该部分中删除 <head> 部分中未使用的元素。

从这些设置中，我们可以从 <head> 部分中删除不需要的元素。

不用担心！

删除这些元素根本不会影响您的网站。

我从这些设置中删除了几个选项，包括评论 RSS、元生成器标签、WordPress 版本标签、REST API 和 RSD 链接。

您可以从您的网站中删除这些设置，它不会损害您的网站。 您也可以仅在不使用RSS 提要链接时删除它。

如果您使用的是Asset Cleanup Pro的高级版，您可以将“ Apply font-display CSS ”值从“ Don't apply ”更改为“ Swap”。 这可以防止您的网站出现不可见的文本问题。 您可以单击此处了解有关此问题的更多信息。

您还可以在预加载部分输入本地字体文件的 URL 以立即加载它。 当我们预加载一个字体文件时，我们显式地增加了资源的优先级。

在本地字体优化设置之后，您会在“谷歌字体”中看到类似的选项。 环境。

只需在字体显示设置中选择“交换”选项并启用预连接。 启用预连接选项将提示并指示浏览器在加载 CSS 时预连接到 Google 字体，从而节省加载时间。

仅在使用 Asset CleanUp Pro 的必要页面上使用插件和工具。

到目前为止，我们已经使用 Asset CleanUp 进行了一些优化，以提高网站的加载速度——但在这个插件中还有一些我们不知道的惊人功能。

这些功能可以包括在网站的特定帖子中加载插件。

简单来说，假设您在您的网站上使用“联系表格 7 ”（用于创建联系表格的最流行的插件）并在您网站的特定“联系页面”上使用它。

但是这个插件的主要问题是它在你网站的<head>部分加载它的 CSS 和 JS 文件，因此它在所有页面（包括联系页面）上增加了两个请求——但我们只需要它加载特定页面，这就是联系页面。

例如; 如果您检查 TheVPNCoupon，我在联系页面和其他帖子/页面（如“最佳动画电影”）上使用“联系表格 7”插件，我没有使用任何联系表格 -但它仍然加载 CSS 和 JS这些页面上的联系表格 7插件（您可以在下图中查看）。

但是你怎么能解决这个问题呢？

解决方案非常简单，您只需发布帖子或页面，然后再次单击“编辑帖子/页面”选项，然后此插件将加载 WordPress 帖子仪表板中的所有文件。

然后从 Asset CleanUp 选项中卸载特定的 CSS & JS 文件。

例如; 如果我正在使用“联系表格 7 ”插件在我的网站上创建“联系我们”页面，那么我将在页面准备好后发布该页面，然后再次单击“编辑页面”选项.

一旦我们点击编辑页面，它将显示当有人加载联系人页面时请求或加载的所有文件。

现在我们将对设置进行一些更改，并从除联系人页面之外的所有页面卸载联系表单 7 的 CSS 和 JS （您可以执行我们在上图中所做的相同设置）。

3.3 优化网站图片

如您所知，图像优化是降低网站速度的最重要因素之一。 它是减慢网站速度的主要来源，因此我们总是必须在将图像上传到您的网站之前对其进行压缩。

即使您在 TheGuideX 上查看我们的任何博客文章，

…图像比我网站上的其他任何东西都重。

因此，优化图像应该会显着提高您的网站速度，而且确实如此。

我们都知道图像对于任何网站都是必不可少的，但不建议使用高质量的图像。 因此，我们必须确保我们上传的图像得到适当的优化。

您应该以这样一种方式压缩图像，它不会降低图像的整体质量，而只会减小图像的大小。

为此，我创建了一个关于图像优化的网站，您可以在将图像上传到 WordPress 之前使用该网站优化您的图像。

要正确优化图像，您必须遵循以下五个步骤；

使用正确的图像格式类型

网络上最常用的两种图像类型是 JPG 和 PNG。

他们不一样；

JPEG 图像示例

图像细节
图片格式	JPEG
图片大小	2.893kb
优化的图像尺寸	607kb
图像压缩百分比	79%
图片描述	具有大量颜色信息的复杂图像。

PNG图像示例

图像细节
图片格式	PNG
图片大小	716kb
优化的图像尺寸	173kb
图像压缩百分比	75%
图片描述	带有少量颜色信息的简单图像

在上面的例子中，我展示了一个 79% 图像压缩率的 JPG 图像和一个具有相似压缩级别的 PNG 图像——但是 JPEG 图像的压缩大小比 PNG 图像的原始大小要大得多，因为它们的复杂性和很多颜色信息。

因此，下一次，每当您在网站上上传图片时，请确保您使用的是正确的图片格式。

3.4 使用 WP-Optimize 优化数据库

到目前为止，我们已经使用 WP Rocket 和 Asset CleanUp 优化了我们的网站，但是如果您仍然觉得您的网站需要更多时间来加载，那么您可以优化您的数据库并删除帖子的修订。

有时当我们更新网站内容或在 WordPress 编辑器上编写内容时，它会自动将修订后的内容保存在我们的数据库中。

因此，优化数据库是提高网站速度的另一个非常有用且重要的过程。

为此，我们将使用一个名为“ WP-Optimize”的免费 WordPress 插件。 该插件由 Team Updraft 开发，他还开发了一个很棒的插件，我建议使用它来备份您的网站。

要使用这个插件，只需从 WordPress 仓库安装“WP-Optimize”插件。

安装插件后，我建议您备份您的数据库，然后转到“ WP-Optimize ”>“数据库”。 当您在数据库页面上时，单击“运行所有选定的优化”，它将开始优化数据库。

优化您的数据库需要几分钟时间，一旦完成，它将删除所有帖子修订、垃圾评论、待处理评论、引用、已删除的帖子和自动草稿。

不用担心！

您的帖子和草稿将保持安全。 它不会删除您网站上发布的任何帖子或任何草稿帖子，但只会删除修订。 所以你是安全的。

3.5 不要在您的网站上使用这些插件

某些插件会降低您的网站速度并导致 CPU 使用率过高。 我总是建议您不要在您的网站上使用繁重的插件。

这些插件可以包括；

在这一步中，我们使用了一些 WordPress 插件来有效地优化我们的网站，如果您检查您网站的 GTmetrix 和 Pingdom 结果，您会看到性能立即提高。

但速度优化不仅仅是通过使用一些插件或快速加载 WordPress 主题来优化网站。

如果您想提高网站的整体性能，还有很多事情要做。 例如，在您的网站上使用 CDN 并从最近的可用服务器提供文件、图像或数据。

4. 使用内容交付网络 (CDN)

在我解释如何使用 CDN 来提高网站性能之前，首先我们将了解什么是 CDN 以及它如何帮助提高网站性能。

那么什么是 CDN 或内容交付网络？

根据 Akamai 的说法，CDN（内容交付网络）是一个高度分布式的服务器平台，通过缩短服务器与用户之间的物理距离，有助于最大限度地减少加载网页内容的延迟。 这允许世界各地的用户查看相同的高质量内容，而不会降低加载时​​间。

那么它如何帮助提高网站的性能呢？

答案是; 每当您访问一个网站时，它都会向远程服务器发出请求，而该服务器会返回数据。 数据传输是通过公共互联网完成的，它会导致一些延迟。

而如果我们减少你的本地机器到服务器的距离，那么它肯定会减少延迟时间并提高网站的性能。

所以现在我们已经了解了在我们的网站上使用 CDN 以及如何提高我们网站的整体性能。

现在我们将讨论一些 CDN 来提高我们网站的性能；

4.1 在网站上使用 Cloudflare

大多数人在他们的网站上使用的第一个 CDN 是 Cloudflare。

Cloudflare 建立了一个庞大的全球数据中心网络，可以缓存更靠近用户的静态内容，并通过最快、最可靠的私有骨干链路提供动态内容

在您的域名上设置 Cloudflare 非常简单； 您只需将您的域名服务器从当前主机更改为 Cloudflare，然后您就可以直接从 Cloudflare 轻松管理您的 DNS。

一旦 Cloudflare 在您的域名上处于活动状态，请登录您的 Cloudflare 帐户，然后从仪表板中选择您的网站。

现在，转到 SSL/TLS 页面并将 SSL 设置为Flexible 。 您还可以将 SSL 设置设置为完整- 但在将 SSL 设置设置为完整之前，请确保您的网站已使用 SSL。

在您的网站上设置 SSL 后，转到 SSL 中的Edge 证书设置并激活“始终使用 HTTPS”、 “ TLS 1.3 ”，并启用“自动 HTTPS 重写”。

现在我们已经使用 SSL 在我们的网站上设置了 SSL。 在这一步之后，点击速度设置，然后点击速度设置下的优化。

进入 Speed 中的优化页面后，为 JavaScript、CSS 和 HTML 启用Auto Minify 。

然后在您的网站上启用Brotli压缩。 Brotli 是 Google 开发的一种压缩算法，最适合文本压缩。

以下是在您的网站上使用 Brotli 压缩的一些功能；

在您的网站上启用Brotli压缩后，您可以向下滚动到Rocket Loader选项，然后启用它。 默认情况下，此设置已启用，但有时此插件与WP Rocket插件冲突并可能导致问题。

现在我们移动到 Cloudflare 中的缓存设置，然后将缓存级别设置为“标准”，将浏览器缓存 TTL分别设置为“ 1 年”。

启用这些设置后，向下滚动到Always Online并单击以启用它。 通过这些设置，如果您的服务器出现故障，Cloudflare 将从缓存中为您网站的静态页面提供服务。

您可以在此处了解有关推荐设置的更多信息。

现在最重要的是使用 Cloudflare 在我们的博客上设置页面规则。

为此，请在 Cloudflare 中打开页面规则设置。 使用 Cloudflare 的免费计划，我们只能创建 3 页规则，如果您想创建超过 3 页的规则，您必须从 Cloudflare 购买更多的页面规则。

如上图所示，我在我的网站 TheGuideX 上创建了一个 3 页规则来提高其性能。 这些 3 页规则是有助于优化我们网站的最重要规则之一。

现在第一件事是单击以蓝色显示的“创建页面规则”按钮。 一旦我们点击它，它将打开一个页面，我们可以在其中创建我们的第一个页面规则。

如上图所示，在第一个字段中，我们必须输入必须应用页面规则设置的页面的 URL，然后我们必须从下拉菜单中选择设置。 完成后，单击Save and Deploy按钮以启用这些页面规则。

Cloudflare 的首页规则

所以第一条规则是；

• 网址：example.com/wp-login.php
• 规则（从下拉列表中选择） ：安全级别，然后选择高或我受到攻击

例子;

本页规则的使用

此页面规则为您的 wp-login.php 文件添加了额外的安全层。 每当有人尝试登录您的 WordPress 仪表板时，它都会首先检查浏览器的完整性，并防止对您的网站进行暴力攻击。

我们还可以使用一些插件来防止我们的网站受到暴力攻击，但是这些类型的插件需要大量的网站资源，并且会降低您的网站速度。 因此，我们使用 Cloudflare 来防止我们的登录页面遭到恶意尝试。

Cloudflare 的第二页规则

第二条规则是；

• 网址：example.com/wp-admin/*
• 规则（从下拉列表中选择） ：禁用性能

例子;

本页规则的使用

此页面规则禁用 wp-admin 文件夹内的性能。 禁用它将禁用站点后端的 Minification、Rocket Loader、Mirage 和 Polish。

Cloudflare 的第三页规则

第三条规则是；

• 网址：example.com/wp-content/*
• 规则 1 ：浏览器缓存 TTL => 一年
• 规则 2 ：始终在线 => 开启
• 规则 3 ：缓存级别 => 缓存所有内容
• 规则 4 ：边缘缓存 TTL => 一个月

例子;

本页规则的使用

第三个页面规则在 wp-content 文件夹内工作，它缓存 wp-content 文件夹内的所有内容，浏览器缓存过期 TTL是 Cloudflare 指示访问者的浏览器缓存资源的时间。

在时间到期之前，浏览器会从本地缓存中加载资源，从而有助于加快网站速度。

边缘缓存 TTL是一项设置，用于控制 Cloudflare 服务器在请求新副本之前缓存资源的时间。

如果您使用 Cloudflare 在您的网站上实施了相同的设置，那么您的网站很有可能在 GTmetrix 和其他页面速度测试工具上开始表现良好。

到目前为止，我们刚刚共享了一个 CDN 来提高我们网站的整体性能。 现在我们将分享更多可以与 Cloudflare CDN 一起使用的 CDN。

4.2 使用 ImageKit 进行图像优化

现在我们将使用 ImageKit 实时优化我们的图像。 它是实时图像优化和转换 CDN 网络之一，可帮助网站减小照片的实际大小，而不会对图像的可见视觉质量产生任何实际影响。

在这个 CDN 中我最喜欢的最好的事情之一是与 WordPress 等应用程序的快速集成。 它确实提供了合理的定价，我发现它是一个更好的选择，可以更好地优化图像。

ImageKit 提供三种 CDN 定价，您可以根据您的网站要求进行选择（我在我的网站上使用的是永久免费计划）。

选择定价并注册到他们的平台后，您必须创建一个End Point 。 创建End Point后，您将获得CDN URL （查看下图）

如您所见，我为TheGuideX域名创建了一个基于Web 服务器的 CDN URL。 我的 CDN 网址是https://ik.imagekit.io/tgx/

一旦我们获得 ImageKit URL，我们必须在我们的 WordPress 网站上启用它。 为此，我们必须通过访问WordPress 管理面板 > 设置 > WP Rocket > CDN 打开 WP Rocket CDN 设置，

进入 CDN 页面后，我们必须为我们的网站启用CDN ，然后在字段中输入 ImageKit 的 URL，并在“ reserve for”设置中将其更改为图像。

一旦你这样做了，WP Rocket 只会将图像的 URL 从https://theguidex.com名称重写为https://ik.imagekit.io/tgx。 因此，您的图像将开始从 CDN URL 实时加载。

进行这些更改后，我们现在将在 ImageKit 中进行一些优化调整，以实现更好的压缩和图像交付。

对于这些优化调整，我们再次登录 ImageKit Dashboard，然后单击Image Settings。

进入图像设置页面后，您可以根据需要自定义设置。

如您所见，我已启用“使用最佳格式进行图像交付” ，并将图像质量启用为 70%。

如果需要，您还可以启用数据保护程序的设置。 如果您网站的用户在其浏览器上使用流量节省程序模式，ImageKit 将使用不同的方法，包括降低质量和不支持自动 DPR，从而使图像更轻且加载更快。

在优化设置旁边，您将获得网络优化选项。 在网络优化设置中，您将获得根据用户的网络类型提供图像质量的选项。

大多数情况下，人们使用 4G 设备。 仔细检查您的分析以了解有关网络类型的更多信息。 如果您发现人们使用较慢的网络访问您的网站，那么您可以从此处手动设置图像传输质量。

所以这些是 ImageKit 最重要的设置，但是你可以从他们的Image Settings页面做更多的设置。

这些设置可以包括手动设置移动和桌面设备的图像高度和宽度，保存图像的副本等，但我们不会在本文中讨论这些设置，它们对我们没有用处。

现在我们将转到在我们的网站上使用 CDN 的第三部分。 在这一步中，我们将向您展示如何在我们的 JS 和 CSS 网站上实现和使用 Cloudfront。

4.3 为 JS 和 CSS 使用 Amazon Cloudfront

如您所知，Amazon CloudFront 是您获得的最受欢迎的 CDN 之一，全球最大的网站都依赖于 Amazon CloudFront CDN 服务。

他们在全球部署了 61 台服务器，能够在特定位置更快地传输和传递网站图像。

首先，点击“ Get Started with Amazon Cloudfront”并使用您现有的 Amazon ID 在他们的网站上注册，或者您也可以使用新的电子邮件 ID 在他们的平台上注册。

登录到 Amazon AWS 帐户后，搜索 Cloudfront（您也可以单击此处直接访问 Cloudfront 页面），然后单击“创建分发” ，然后选择Web 属性并单击“开始”。

在原始域名中，输入您的域名。 在这种情况下，我的域名是https://theguidex.com，所以我输入的是theguidex.com （没有 www 或 https）。

在它旁边，您必须输入原始路径，输入 wp-content 文件夹的路径，然后在 SSL 协议中选择TLSv1并在原始协议中选择“匹配查看器” 。

现在，向下滚动到“分发设置” ，然后在价格类别中选择“使用所有边缘站点”并设置默认的 CloudFront SSL 设置。

您还可以设置S支持的HTTP 版本并将其更改为“HTTP/2、HTTP/1.1、HTTP/1.0”。 完成这些设置后，单击“创建分发”。

再次转到 Cloudfront 分发页面并检查您的分发是否正确启用（它将显示在状态部分下的绿色文本中）。

启用后，单击您的源域的ID 。

当您单击分发 ID 时，它将打开我在上图中显示的类似页面。 复制域名（如红框所示）并粘贴到 WP Rocket 的 CDN 部分。

将域名粘贴到 WP Rocket 中后，选择保留的to => “ Javascript/CSS ”。

现在您已成功在您的域名上设置 AWS Cloudfront。

这些设置足以让您的网站提高其在 Google PageSpeed Insight、GTmetrix 和 Pingdom 中的性能。 您现在可以看到网站性能的即时增长。

不过，如果您不确定如何提高网站速度，或者您需要网站速度优化服务，您可以通过[电子邮件保护]电子邮件与我联系。

到目前为止，我们已经做了几乎所有可能的事情来优化我们的网站速度——但是如果你是一个高级用户，那么我将分享更多的方法来帮助你提高你的网站速度。

但是，如果您是初学者或者您没有任何技术知识，那么我建议您联系您的托管支持以管理此类内容。

微调 WordPress 以提高速度（高级）

在这个微调 WordPress 速度优化方法中，我们分享了一些高级技巧，这些技巧可以惊人地优化您的网站速度。

1.使用最新的PHP版本

因此，优化网站的第一种方法是使用最新的 PHP 版本。 较新的 PHP 7 比它的前辈快两倍。 这是您的网站必须利用的巨大性能提升。

为什么要使用最新版本的 PHP？

如果您不知道为什么要在您的网站上使用最新版本的 PHP，那么这里就是答案，WordPress 主要是用 PHP 语言编写的，而 PHP 是一种服务器端语言。

因此，如果您在您的网站上使用最新的 PHP 版本可以提高您网站的性能。 PHP最新稳定版本为v7.4； 我什至在这个网站上使用这个版本的 PHP。

2. 限制后期修改

有时我们忘记使用像 WP-Optimize 这样的插件来优化我们的数据库，正如我上面提到的，当我写这篇文章时，它已经在我的数据库中保存了 40 多个修订。

有时，自动保存这么多修订可能会将您网站的性能降低到最差的水平。 您可以轻松限制 WordPress 为每篇文章保留的修订数量。

将这行代码添加到您的 wp-config.php 文件中。

 定义（'WP_POST_REVISIONS'，4）；

3. 禁止盗链和盗取您的内容

有时，如果我们在我们的网站上创建高质量的内容，它会通过使用 RSS 被盗，有时其他网站会直接从您网站上的 URL 提供您的图像，而不是将它们上传到他们自己的服务器。

这样，它会损害您的网站，因为他们正在窃取您的网站带宽，而您不会从中获得任何好处。

所以，在这种情况下，我们必须使用 .htaccess 代码来阻止图片的盗链，以节省您的网站资源和带宽。 代码如下；

 #禁用带有禁止或自定义图像选项的图像热链接
重写引擎开启
重写条件 %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?theguidex.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
重写规则 \.(jpg|jpeg|png|gif)$ - [NC,F,L] 

注意：不要忘记将 theguidex.com 更改为您自己的域名。

如果您没有在您的网站上使用 RSS 提要，您也可以禁用它。

4. 使用 DNS 级别的网站防火墙

速度优化的另一个最重要因素是使用 DNS 级别的网站防火墙。 如果您还记得，我在 theguidex.com/wp-login.php 上创建了 Cloudflare 页面规则，以提高我的登录页面的安全性。

好吧，我还在我的网站上使用高级版 Wordfence，这是一个很棒的插件，它有助于实时阻止威胁、暴力攻击，但毫无疑问； 这是一个沉重的插件，我需要大量的网站资源来对抗威胁。

为了防止高 CPU 资源使用率，我在我的网站上使用了 DNS 级别的网站防火墙。 因此，请确保您使用 DNS 级别的防火墙来提高您网站的性能并阻止 DNS 级别的威胁。

5. 减少数据库调用

这一步稍微复杂一些，它需要技术知识来减少主题中的数据库调用。 有许多编码不佳的主题不遵循 WordPress 指南，并且对数据库进行了太多不必要的调用。

这些主题可能会减慢您的网站速度并减少它可以减少数据库调用并提高您网站的整体性能。

甚至一些干净编码和优化良好的主题也会进行不必要的数据库调用以从数据库中获取基本信息。 因此，创建一个子主题并静态添加此基本信息以减少数据库调用的次数。

6. 将评论拆分成页面

如果您在博客上收到很多评论，那么首先，恭喜！ 这是建立大量观众的一个很好的迹象。

但缺点是，加载包含所有评论的帖子会减慢速度。

在这种情况下，您可以将评论分成不同的页面，以进一步提高网页的速度。 这个过程很简单，只需转到设置»讨论并选中“将评论分成页面”选项旁边的框。

7. 检查 GZIP 压缩

GZIP 压缩是提高网站速度的另一个最关键因素。 如果您在您的网站上使用 wp Rocket 插件，那么它会自动为您启用它。

GZIP 压缩在服务器端启用，它有助于压缩 HTML、JS 和 CSS 文件的大小。 它不适用于图像，因为它们已经以不同的方式压缩。

您可以使用检查 GZIP 压缩等工具来检查您的网站是否使用 GZIP。

如果您的网站没有使用 GZIP，那么您可以在 .htaccess 文件中使用此代码在您的网站上启用 GZIP - 但请确保在使用此代码之前在您的网站上使用 apache 服务器。

 # 压缩 HTML、CSS、JavaScript、文本、XML 和字体
  AddOutputFilterByType DEFLATE 应用程序/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 应用程序/x-javascript
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE 应用程序/xml
  AddOutputFilterByType DEFLATE 字体/opentype
  AddOutputFilterByType DEFLATE 字体/otf
  AddOutputFilterByType DEFLATE 字体/ttf
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE 文本/css
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE 文本/javascript
  AddOutputFilterByType DEFLATE 文本/纯文本
  AddOutputFilterByType DEFLATE 文本/xml

  # 删除浏览器错误（只有非常旧的浏览器才需要）
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] 无 gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  标题追加不同的用户代理

8. 使用预取

资源预取是另一种提高网站性能的重要优化技术。 我们可以使用它来告诉浏览器用户将来可能需要哪些资产——甚至在他们需要它们之前。

作为开发人员，我们比浏览器更了解应用程序。 因此，我们使用这些信息来通知浏览器有关核心资源的信息。

例如，

 <链接rel = “预取” href = “ image.png ” >

9.减少网络字体的使用

有时为了让文本更吸引人，我们会使用几种网络字体——但使用太多网络字体的最大缺点是会增加页面的渲染时间。 这还会向外部资源添加额外的 HTTP 请求。 一般来说，您希望将 HTTP 请求保持在最低限度。

正如您在上图中看到的，我在我的网站上只使用了四种我真正需要的网络字体。 您还应该确保您的博客没有使用大量不必要的网络字体来减少页面的呈现时间。

现在轮到你了

在优化 WordPress 博客的各种方法中，我分享了一些优化技术，我个人在自己的网站上使用这些技术来优化速度。 这些方法简单易行。

现在是您花一个小时提高 WordPress 网站速度的时候了。

相信我，一旦你用这些方法仔细优化了你的博客，你的网站的性能将会提高，它也会提高网站的整体加载时间。

我希望这篇文章能让你清楚地了解一些提高 WordPress 博客速度的有效方法，如果你觉得这篇文章有帮助，请在评论部分告诉我们。 如果您使用其他方法来优化您的网站，请在下面的评论部分告诉我。