WordPress加载时间不超过2秒的非开发人员指南(2)

请注意,虽然您可以通过对HTML的基本理解来进行一些优化,但也有一些拐点,在这里您可以获得一个技术资源,并找出改善站点加载时间的最佳方法。

WordPress加载时间不超过2秒的非开发人员指南

WordPress加载时间不超过2秒的非开发人员指南

步骤1:为我们的页面速度度量基准

基准的网页速度指标的快照

首先,我在站点的主页和一个更深入的文章页面上,对每个站点的页面速度指标进行了快照。我特意为这篇文章做了这个。如果您想要优化您的站点,您最好希望查看度量站点范围,或者至少是在您站点上的每个模板的一个典型页面上。

与一些网站相比,这些数字并不可怕——但是对于那些在WordPress上建立的简单的内容网站,没有太多的花哨功能,这绝对有很大的改进空间。

我们所做的是实现四种不同的推荐页面速度优化。下面,我们将看到每个优化在实现时的影响,以及所有优化的累积影响。

步骤2:清理代码

谷歌的PageSpeed Insights工具建议我们“缩小”每个网站的CSS、JavaScript和HTML。为此,我们使用了一个免费的WordPress插件。在这四个网站上设置了大约20分钟的时间:

这是一个自动运行的WordPress插件的截图

在优化了HTML、JS和CSS,并将JS和CSS加载到内部之后,谷歌的工具将最小化并“消除了在上面的内容中对JavaScript和CSS的限制”,进入了“优化发现”的专栏:

谷歌页面速度工具优化发现:

缩小后页面加载时间的截屏

正如您所看到的,大多数页面都看到了改进,一些人看到了显著的20%以上的升级。但在某些情况下,几乎没有什么百分比的改善,甚至更糟糕的表现。从测试到测试有一些差异,但是您看到的是,虽然这些改进通常会提高页面速度,但是它们的影响程度是不同的,并且依赖于站点。

请注意:这是插件的免费版本,在理想的设置中有一个“最佳猜测”。在更改站点代码时要小心,稍后我将在文章中提到,这是一个特定的领域,您可能希望向开发人员寻求指导。

步骤3:浏览器缓存

接下来,我们希望利用浏览器缓存。通常,你可以使用像WP Super Cache或WP Rocket这样的WordPress插件,但是这些站点是在WP Engine上运行的,它与一些插件有一些兼容性问题。因此,我们简单地启用了WP Engine对象缓存:

在WP Engine中浏览器缓存的截图

启用浏览器缓存后,站点页面速度的所有指标的表示

正如您所看到的,这比我们的代码清理工作有更大的影响,而且对于两个站点,我们看到显著的性能提升20%到30%,只有两页看到开始渲染时间的增加。

步骤4:实现CDN

同样,WP Engine有自己的CDN选项,所以我们启用了它,这也是WP Engine中一个非常简单的过程:

启用WP Engine CDN的屏幕截图

一旦CDN实现,页面速度度量的表示

这是第一个实现我们实际看到性能显著下降的实现。有几件事需要注意:

一个CDN的实现是为了提高全国各地用户的页面速度,因此理论上它(正面)的影响应该更多地针对世界各地不同地区的不同测试用例。

同样,这只是针对少数站点的一次测试——其他人测试了WP Engine CDN,并看到了更好的结果,因此您的里程可能会有所不同。

这里最重要的一点是,再一次,不是所有的优化都会对每个站点产生同样的影响,偶尔,一些努力将会产生最小的或者没有真正的影响。

步骤5:图像优化

最后,我们对每个站点的图像进行压缩和缩放。在某些情况下,网站上的图片已经被压缩了,最大的罪魁祸首是(如你所见)网站4的主页。我发现在那些忽略了它的站点上,图像优化通常是最快、最容易和最高影响的页面速度。

为了做到这一点,我们使用了一个名为Optimus的图像压缩插件。我们还对页面上的每一幅图片进行压缩和调整,以确保压缩不会影响质量,而且文件尽可能小:

Optimus图像优化

有很多针对WordPress的图片优化插件,但不限于:

图片图像压缩

短的像素图像压缩

当你使用这些插件时,如果你将它们应用到你的媒体库中的所有现有图片上,你就必须认识到潜在的图像质量/渲染问题。(在页面速度方面的一些额外的测试/推荐之后,更多的关于这方面的建议——我们实际上已经切换到短像素了。)

在你上传图片之前,也有许多工具可以压缩你的图片,包括:

也还有很多其他类型的。

有什么影响吗?

图像优化后的页面速度的表示。

从几个主页可以看到,压缩图像可以带来一些最大的页面加载。最重要的是,压缩图像和替换未压缩的版本是您通常不需要任何类型的开发帮助的任务。

尽管如此,改进的程度取决于站点。图片已经被压缩和调整的网站(或者刚好是更小的)很明显地看到这一步骤没有任何收获。

那么,我们的努力的累积影响是什么呢?

总页面速度改进的显示

正如您所看到的,这里的结果各不相同。但是,我们通过这些步骤,将加载时间缩短了2秒,在几乎每一个实例中,我们都提高了访问者看到我们的内容的速度。

但是,在我们的所有努力中,一些加载时间实际上变得更糟了,似乎对于一个简单的站点,我们应该能够击败很多加载时间。那么,你还能做些什么呢?

额外的步骤:雇佣专业人员!

在我的业余DIY努力获得了很大的收益之后,我决定继续雇佣一个专门从事页面速度优化的开发人员。我们的专家致力于使载重量更低。具体来说,他们:

在我的WordPress配置中移除或替换插件,他们认为这是在减慢网站的速度。

调整了我安装的速度优化插件的代码、服务器配置和配置。

这个过程实际上减少了我们(改进的)负载时间的一半。这是一个很好的例子,说明一个精通页面速度最佳实践的开发人员可以极大地提高您的结果。

如果您在内部有一个开发资源,可以交流您的目标(减少页面加载时间和用户认为重要的、高于折叠的元素的速度),如果有必要,请共享资源,以确保他们知道加速站点的最佳实践。

相关内容:>>>>WordPress加载时间不超过2秒的非开发人员指南(1)

发表评论

邮箱地址不会被公开。 必填项已用*标注