WordPress速度优化教程

相信很多人都希望自己的网站和博客更加的快,尤其是无法忍受Google Pagespeed Insight的低分评价。在这篇教程中,我将会教你如何提高自己的网站速度,以及根据Google Pagespeed Insight的提示进行优化。

内容列表

WordPress速度评分多少合适

在开始之前你需要知道到底多少分是合适的。如果你像我这样子,直接自己写代码,那么你达到99分都是可能的。下面这个就是我自己开发的rankly.cn网站的Google速度评分。

Rankly的PC速度评分
Rankly的PC速度评分

但是如果你用Wordpress,你的上限是很难达到这个数字的。我一般认为50分~80分都是正常的。下面是一个我用siteground搭建的一个wordpress,是一个个人博客,用的是Astra主题所搭建的。

wumadev.com速度评分
wumadev.com速度评分

另外,手机端的速度评分远不及PC端的;这是因为手机端的测试环境是手机4G网络,这将会极大降低网站加载速度。这里是我上面同一个博客的手机端速度评分。

wumadev.com速度评分
wumadev.com速度评分

所以在开始之前,你需要心理有一个预期,你大概能够达到的范围。我上面的评分是基于一定的经验实现的。如果你是完全新手,可能会遇到一些困难或者错误,例如选择错了主题。

WordPress怎么优化速度

在Wordpress里面做速度优化,是可以非常傻瓜式的,因为有很多不同类型的插件已经帮你完成了重要的工作,而你只需要选对工具就可以了。

使用Next Gen图片格式

为了能够极大程度上提高网站的速度,你最先应该解决的应该是图片问题。Google Pagespeed Insight里面有很明确的声明,你需要使用next-gen图片格式,例如webp。这个图片格式能够极大的减少你的图片尺寸以及增加你的网站的加载速度。

在Wordpress实现webp自动转换,这里我推荐使用Converter for Media,这是一个自动转换图片至Webp的插件,非常好用。

速度优化:图片插件Converter for Media
速度优化:图片插件Converter for Media

安装之后,你可以批量转换原来的图片至webp格式。你在左边找到Converter for Media,然后直接点击Start Bulk Optimization即可。

批量图片优化
批量图片优化

后续你只要上传了图片,它都是会自动转换成webp格式的,你无需手动进行。

缓存策略以及压缩HTML,CSS,JS文件

接下来你需要给你的网站设置缓存和压缩HTML,CSS和Javascript文件的策略。压缩文件大小可以避免不必要的代码发送给用户,加大你的网站访问速度。同时缓存策略可以帮助你的网站提高响应速度。

我们这里使用hummingbird来完成上面的东西,同样是一个免费的速度优化插件。

安装hummingbird
安装hummingbird

安装了Humming bird之后,直接在左边找到后台,点击进去初始化。

第一次进入humming bird
第一次进入humming bird

它会问你一些问题,你只需要一直点击下一步即可。

初始化humming bird
初始化humming bird

Asset Optimization主要是为了减少页面加载时候额外不需要的请求数量,直接接受启动即可。

初始化humming bird
初始化humming bird

Caching缓存策略全部启动即可,点击下一步。

初始化humming bird
初始化humming bird

Advanced Tools主要是包含了自动移除query中的字符串从一些assets当中,以及删除掉emoji专用的css和js。一般网站都是默认开启的,如果你打算在你的网站使用很多emoji,请关掉这个功能

初始化humming bird
初始化humming bird

这就是设置完毕了,你可以点击右下角直接启动。

初始化humming bird
初始化humming bird

优化数据库

WordPress的数据库里面有很多残留项目是可以被移除的,这个有利于加快检索。但是我站在程序员的角度也可以告诉你,这个检索的前后差异不会太大,除非你本身拥有大量的内容在CMS系统里面。

为了达到清理不必要的数据库项目,我这里会用到WP Optimize这个插件。这个插件有很多的功能,而我只用里面的一个数据库清理功能而已,免费的。首先在Wordpress插件市场中找到这个插件,然后直接点击安装。

安装WP Optimize
安装WP Optimize

安装之后,直接打开,然后选择Run All Selected Optimizations。它系统会默认勾选一些优化项目,基本你不需要去进行选择,按照默认的进行优化即可。

直接开始优化
直接开始优化

等到优化完毕之后,你就可以看到下方的一个优化报告;里面包含了每个项目到底优化了什么东西。

WP Optimize报告
WP Optimize报告

这里面基本都是数据库的多余项目被删除,所以如果你看不懂的话也不用太在意。这个操作理论上说是可以提高Wordpress的反应速度的,只是提升效果也当然很有限,尤其是你是一个小网站的时候。

启动图片内容懒加载

懒加载可以极大程度减少用户等待页面内容的时间,而且也可以缓解你的服务器负荷,是属于优化必须要做的选项来的。

为了实现懒加载,我在Wordpress推荐使用的插件是Smush。在插件市场中找到这个插件,然后直接点击安装。

Smush
Smush

安装了之后,在左边栏直接找到lazy load,然后点击activate即可,超级简单。

激活Smush Lazy Load
激活Smush Lazy Load

选择专业的CDN服务

首先,很多人可能不了解什么是CDN服务。用人话来讲,CDN服务能够拉近你的数据以及用户访客的距离。哪怕你的服务器是在美国,访客是在日本,他也能非常快加载成功你的网站。

CDN服务的话会需要你修改你的网站的CDN配置,我个人推荐使用的是cloudflare

cloudflare
cloudflare

GZIP压缩

WordPress也可以使用gzip压缩的策略来优化速度,如果你是使用siteground搭建的话,是默认已经开启了gzip。如果你的网站是自己通过VPS搭建的话,就需要你进行一定程度上的代码修改。

如果你是Nginx,我建议根据Hummingbird的gzip教程来做,如下图:

Gzip Nginx代码
Gzip Nginx代码

如果你是Apache,我建议查看这篇教程,主要是要修改.htaccess。

最后

如果你优化完毕了一个Wordpress之后,你能够直接非常直观在Google PageSpeed Insight中看到分数的提升的。如果你想要看我如何从0搭建一个Wordpress,可以查看下面的教程。

发表评论