「javascript」如何在20分钟内加快WordPress网站的速度

每个人都知道页面速度很重要。这是一个在桌面和移动设备上确认的Google排名因子，会影响用户体验，并可能直接影响您的底线。

但缓慢的文字按压网站是一个常见问题。

这里是PageSpeed Insights中我的一页移动得分。

优化前。

如果我们运行整个网站通过Ahrefs的站点审核，该审核显示了所有页面的页面加载时间，我们发现这也不是唯一的慢速加载页面。它们都没有大规模加载，平均加载时间为570ms。

优化前。

现在是在大约20分钟后的同一页页面速度优化：优化后

。

和现场审核中的其余页面：

优化后。

差异是昼夜。PageSpeed Insights的得分接近完美，每页的加载速度都非常快。

在本指南中，我将通过几个简单易行的步骤向您展示我是如何做到这一点的。

1. 删除未使用的插件
2. 将DNS提供商切换到Cloudflare
3. 安装缓存插件
4. 最小化代码
5. 组合CSS和JavaScript文件
6. 消除渲染阻塞资源
7. 延迟加载图像和视频
8. 优化Google字体
9. 启用预加载
10. 使用CDN
11. 优化图像

重要

许多下面推荐的优化使用WPRocket，这是一个用于加速WordPress网站的付费插件。我在可能的情况下列出了免费的替代方案，但重要的是要注意插件有时可能会相互冲突并导致问题。在推动对现场站点的任何更改之前，您应始终在分期环境中测试它们如何影响您的站点。了解如何在此处设置分期站点。

javascript

https://www.*******.com/watch？v=BrY6a-lsLp8

步骤1。删除unused插件

除非您有一个全新的WordPress网站，否则您很可能已安装了一堆多年来未使用的插件。其中一些会影响页面速度，因此值得取消激活和卸载您不需要的任何内容。

这样做时请小心。如果您不确定是否需要，请将其留在那里。

步骤2。切换DNS提供商到Cloudflare

网站是连接到internet的硬盘（服务器）上的文件。连接到互联网的每个设备都有一个IP地址（例如123.123.12.1）。

因为IP地址难以记忆，所以域名被映射到使用DNS的IP地址，其代表域名系统。您可以将其视为web的音素本。当您在浏览器中输入域时，会进行DNS查找以查找服务器的IP地址。

但事实如下：大多数人使用免费的DNS来自其域注册商的提供商，通常很慢。

如果是您，请切换到更快的DNS类似提供商的Cloudflare。

要做网站服务器这，注册一个免费的Cloudflare帐户。点击“添加网站”，输入您的域名，然后点击按钮。

选择免费计划，然后单击“确认计划”。

cloudflare现在让您有机会在继续之前查看您的dns设置。如果没有警告，继续通常是安全的。

现在剩下的就是将您的姓名与您的域注册商交换。您这样做的方式因注册服务商而异，因此如果您不确定如何执行，请不要犹豫询问他们的支持。

如果您使用Google域名，这是一个过程：

步骤3。安装一个caching plugin

缓存是一个临时存储文件的过程，可以更有效地将文件传递给访问者。

有两种主要类型：

• 浏览器缓存：在用户硬盘上保存“常见”文件，如徽标，因此无需在重复时重新下载它们访问。
• 服务器缓存：在服务器上保存一个完整构造的页面“静态”版本，因此每当新访问者请求时都不必重建它。

WP Rocket可以轻松启用缓存。只需购买，安装并激活它。基本缓存（服务器和浏览器）默认打开。如果您的网站有响应，请直接访问缓存设置并选中该框以启用移动设备的缓存。

寻找免费选项？尝试W3 Total Cache。

步骤4。Minify代码

Minification从代码中删除空白和注释以减少文件大小。更小的文件可以加快加载时间。

如果您正在使用WPRocket，请勾选复选框以在设置中最小化CSS和JavaScript。

如果您不使用WPRocket，安装并激活自动优化并执行此操作。

只需知道，在部署live之前，您应该始终测试这对网站的影响。最小化通常会导致代码损坏，尤其是在Javascript方面。

步骤5。结合CSS和JavaScript文件

大多数WordPress网站包括多个CSS和JavaScripts文件。有些是针对主题的，有些是针对插件的，你也可能有一些自定义的主题。组合这些文件可能会加快工作速度，但这取决于你的服务器设置。215 216和217 HTTP 218/1.1，CSS和JavaScript文件连续加载。这意味着一个文件需要在下一个文件开始加载之前完全加载。

使用HTTP/2，文件同时加载。这意味着多个CSS和JavaScript文件可以同时开始加载。

如果您的服务器使用HTTP/1.1，则组合文件会加快速度，因为需要加载的文件更少。如果它使用HTTP/2，组合文件不一定会产生很大的影响，因为文件无论如何都可以同时加载。

要查看您网站使用的版本，请将域插入关键CDN的测试程序中。

如果不支持HTTP/2，值得组合CSS和JavaScript文件。

要在WPRocket中做到这一点，请在复选框中勾选“组合JavaScript文件”和“组合CSS文件”。

如果您正在使用自动优化，则有两个复选框来“聚合”文件。只知道这些有时会“打破”你网站上的事情，所以值得仔细检查的是，一旦启用，一切仍然看起来和功能相同。并记住事先清除缓存并检查incognito窗口中的更改。否则，更改可能不会反映在您看到的内容中。

步骤6。消除渲染阻塞资源

渲染是将代码转换为可见网页的过程。

关键词“可见”，因为网页并不总是需要在可见之前完全加载。

因此，优先考虑“高于折叠”内容的加载资源是有意义的。

您可以通过推迟“低于折叠”所需的非关键CSS和JavaScript文件的加载'内容直到稍后。要做到这一点，在WPRocket，c检查框以“加载JavaScript延迟”和“优化CSS交付”。

如果您不使用wprocket，则需要两个插件：Autoptimize和异步JavaScript。

在Autoptimize的设置中，选中“Inline and Defer 285 CSS 286”框。然后，在异步JavaScript的设置中，单击“启用异步JavaScript”。如果您之前在PageSpeed Insights中看到了“消除渲染阻塞资源”问题，这通常可以解决这个问题。img id 16 alt 12 render blocking PageSpeed Insights-292-imgid=17 alt=12呈现阻止页面速度见解-

步骤7。延迟加载图像和视频

延迟加载通过推迟图像和视频的加载直到它们在屏幕上可见来提高页面速度。如果您正在运行WordPress 5.5+，则默认情况下启用图像延迟加载，但不适用于视频。

如果您正在使用WPRocket，通过在lazy Load设置下勾选“启用iframes和视频”框来解决此问题。

如果您不使用WPRocket，则视频插件的免费延迟加载做同样的事情。

步骤8。优化Google字体

许多主题使用Google字体，每次有人访问网站时都必须从Google服务器下载这些字体。这可能是一个耗时的过程，因为您的服务器必须进行HTTP请求，下载CSS文件，然后从样式表中引用的位置下载字体。

如果您正在使用WPRocket，它将自动优化Google字体请求。否则，交换Google字体显示是一个很好的起点。

步骤9。启用预加载

预加载允许您e定义基本资源，因此浏览器知道要加载文件的优先级。

例如，让我们说您的代码如下所示：

<脚本类型=“text/javascript”src=“somefile.js“>内容

基于此代码，由于层次结构，JavaScript文件需要首先加载。这并不理想，因为CSS文件几乎肯定比JavaScript代码更关键。

解决此问题的最简单方法是添加另一行代码，如下所示：

告诉浏览器在JavaScript文件上对CSS文件进行优先级排序，无论其层次结构如何。

您可以通过编辑代码手动添加预加载属性，但这可能会除非您知道自己在做什么，否则会变得混乱和困惑。只需安装WPRocket就容易了，WPRocket会自动将其开箱即用。

步骤10。使用aCDN

内容传输网络（CDN）是分布在世界各地的服务器组。这些存储中的每一个都存储您网站的副本，因此用户在请求网页时连接更快。

例如，假设您的web主机的服务器位于UK。如果有人从US访问您的网站并且您未使用CDN，则其设备和服务器之间的连接将很慢。如果有人从US访问并且您使用CDN，他们的设备将连接到最近的服务器，这有助于更快地连接事物。

有很多CNS提供商，所以您需要做的就是选择一个，在WPRocket中启用它，并输入CNAME。

步骤11。优化图像

延迟加载解决了许多与图像相关的问题，但它没有做任何事情来帮助加载到折叠上方的图像。它们越大，对加载时间的**影响就越大。

要解决这个问题，请使用像Shortpixel这样的插件压缩图像。只需安装，激活它，转到设置，输入您的API键，单击“保存并转到批量处理，然后单击“重启优化”。

如果您发现质量太低，请直接设置压缩类型并更改为光泽

结果

让我们看看这些优化如何根据一些流行工具影响我们的页面速度。

以下是Google页面速度中我的帖子的前后统计信息

-img id=414>-img id=27 alt之前-

您可以看到页面之前已完全加载5.9秒，页面大小为1.89mb，请求为67个。优化后，所有三个指标都下降了。页面大小为695千字节，完全加载时间为4秒，请求数量减少了近50%。

如果我们在Ahrefs的网站审计中检查网站上的所有页面，我们看到平均和第95百分位负载时间大约提高了40%。

最终想法

以上所有内容都适用于我的网站，它也适用于其他网站。但是，重要的是要记住，每个WordPress配置都是不同的。您可能会有更多插件，更群集的主题，更慢的托管或更多的第三方跟踪脚本，所有这些都会减慢您的网站速度。

如果您的页面速度在进行这些优化后仍然可以进行一些改进，那么您可能需要在网站上完成自定义工作。因此，值得聘请开发人员或页面速度专家更仔细地了解一些事情。

或者，如果您需要有关特定问题的更多详细信息，请查看我们的完整页面速度指南。

我们是否错过了本指南中的重要内容？在Twitter上Ping我。