Pages

Wednesday, 25 October 2017

WordPress性能优化指南


当今的网络设施更新迭代非常迅速,普遍是10M光纤以上,再也没有人愿意长时间等待网页载入了。与此相对,网页能够快速的载入绝对是有利于用户体验的。我对此也进行过很多尝试,希望能够提高博客的访问速度,对于一些常见的WordPress加速方法均有些体会,所以分享出来希望可以帮助其他人少做错误的尝试。

一、常见拖慢速度的影响速度

为什么把拖慢速度的影响因素放到加快前面,根据木桶理论,决定木桶中盛水量的决定性因素是最低的那块木板,其他的优化的再好,一个页面元素就能拖慢整体的速度了。当然对一个网站来说,存放网站的主机本身是非常重要的,一般来说除了CPU、IO、内存的性能要足够外,Ping和掉包率不能太高。当ping值大于300或者掉包率大于15时,整个网站再怎么优化都很难有出色的表现,由于主机选用后难以变更,所以这里假定你的主机整体性能还可以。

cannikin-law

1-1引用的元素

1-1-1问题自检

从这里开始,需要学会一点浏览器的分析工具(chrome-devtools)的用法,以帮助我们能够更精确的分析页面性能的状况而不是凭借感觉判断。我这使用的是Chrome浏览器,Firefox浏览器也有类似工具,使用方法大同小异,这里是以Chrome做示范。打开方式非常简单,在网页中空白处 鼠标右键–检查,或者快捷键Ctrl+Shift+I就能打开Chrome浏览器的分析工具(chrome-devtools)。



它的全貌是这样的:

wordpress-performance2



敲入网址回车进行访问,测试一下:

wordpress-performance4

1-1-2Gravatar头像

Gravatar头像由于没有国内服务器,从国外访问速度是很不理想的,并且国际线路抽风也是常态,所以这个时候就需要进行决择了,是设定不显示头像,还是使用其他人提供的反代CDN的Avatar头像,或者也可以自己反代一个。例如要替换为V2ex的Avatar头像,可以在外观–编辑–functions.php中加入下列一段代码:

function getV2exAvatar($avatar) {
        $avatar = str_replace(array("secure.gravatar.com/avatar","0.gravatar.com/avatar","1.gravatar.com/avatar","2.gravatar.com/avatar"),"cdn.v2ex.com/gravatar",$avatar); return $avatar; } add_filter('get_avatar', 'getV2exAvatar');
除了V2ex提供的Gravatar CDN服务,还有其他的也十分值得使用,要更换V2ex的反代头像为其他服务,只需要更换上列代码中的cdn.v2ex.com/gravatar为下列其中一个地址即可。

七牛云Gravatar(推荐):

dn-qiniu-avatar.qbox.me/avatar
多说Gravatar:

gravatar.duoshuo.com/avatar
中科大Gravatar:

gravatar.lug.ustc.edu.cn/avatar
MoeCDN Gravatar:

gravatar.moefont.com/avatar
极客族Gravatar:

sdn.geekzu.org/avatar
1-1-3Google字体库

除了Avatar头像,也很有可能是谷歌字体还有其他引用的公共库导致的整体速度被拖慢,这里可以替换为国内的一些CDN公共库,也可以托回到自己的主机上,直接引用自己的主机地址,这样的好处是减少了DNS查询的时间,也因此一般不建议替换网站中原本的JS为公共库的CDN。不过当你的主机在国外,国内下载速度非常慢的时候,使用一个高速的CDN公共库也就变得有必要了。

当你通过上面提到的chrome-devtools工具发现自己的页面引用有谷歌字体,那么禁用谷歌字体是个很好的选择,因为页面加载的字体都只针对英文、数字和特殊符号,中文字体包的体积过大,没人会在网页中插入中文字体,所以禁用谷歌字体对中文网站的影响不大。当你决定要禁用谷歌字体时,可以到WordPress的外观-编辑中选择自己当前正在使用的主题,在funtions.php模版(并不总是在funtions.php模版模版中,需要自己去查找)中找到引用的谷歌字体,并注释那一行代码。


以WordPress 2017年度主题Twenty Seventeen为例
1-2插件

插件的使用越少越好,WordPress本身已经足够安全,如果使用未知第三方插件可能会导致安全问题。很多功能可以轻松的使用代码实现,就没有必要使用插件了,比如网站地图(sitamap.xml)等功能就可以使用代码实现。在使用插件需要审视自己是否真的需要那些功能,如果确定需要就寻找能否可以使用代码的方式代替,在找到代码实现的方法后,若是认为代码实现的操作难度大于自己的水平,那么就果断使用插件。毕竟插件本身就属于WordPress的一大优点,也不是每个人都那么Geek,什么都能自己搞定的。

对于一些功能还可以使用另类的方式替代,比如对于输入代码的功能。我并非码农,也并不期待能够再这方面有所建树,但在贴代码方面有着小量的需求,所以我就使用了标签的而非插件的方式来粗略的实现这一目的。比如对于一些短代码就使用code标签,效果:<code>this is code</code> 对于一些长代码使用<pre>标签,效果如下(无高亮功能):

this is code
使用 pre 标签有个缺点,就是不能插入PHP整段代码,显示会有异常,对于大多数人来说这并不是一个问题。

二、加速你的网站

2-1静态缓存
都知道静态博客的速度快,那是因为静态博客只需要访问,并不需要动态生成页面。使用WordPress时可以使用一些静态缓存插件,生成静态文件供用户访问以提升访问速度,并且生成的缓存是一次性的,对于高访问量的网站还能减缓主机负载。

使用静态缓存推荐一个插件WP-Super-Cache,WP-Super-Cache是使用人数最多的一个静态缓存插件,功能非常强大,可自定义选项多同时还保持着良好的兼容性。安装好插件后需要设定启用缓存,缓存模式我推荐选择『mod_rewrite 缓存模式』,速度最快,对于插件推荐的选项全部勾拳,把缓存超时时间设置为0,禁用缓存自动回收。

2-2 Pagedpeed
Google也深知网站速度的重要性,推出了很多站长工具来帮助提升网站速度,Pagespeed就是Google推出的一个前端自动优化模块,支持Apache和Nginx。拥有非常多的优化功能,大名鼎鼎的域名商、空间商GoDaddy就在自己的主机上部署了Pagespeed以提升主机使用者网站的访问速度。

有一篇文章专门介绍了Mod_pagespeed的使用方法,详细的介绍了各种小技巧。

2-3CDN

如果你的站在国内并且已经备案了,那么国内各大CDN均是很好的选择,如果未备案只能选择海外的CDN加速服务Cloudflare等,那么就有可能加速后不如加速前,这个可以自行测试选择。选择CDN能够隐藏自己的主机IP,一定程度上使得网站更加安全,不容易遭受攻击。

如果确实不想备案,又想要使用国内的CDN,可以尝试如七牛、又拍等静态文件CDN服务,和静态缓存插件WP-Super-Cache配合,速度提升非常明显。


小结

网站加速是个永恒的课题,优化方法无非是空间换时间。对于海外主机来说,主机本身的网络线路能够很大程度上影响网站的访问速度,所以选择主机时要谨慎选择。其实对于网站速度来说,个人博客的速度能过得去就行了,不应该太高的要求。因为要想达到很快的速度,需要投入大量时间和金钱,这对于一般人来说,值不值是需要考虑的。

毕竟也不能偏离写博客的初衷,记录与分享,内容最重要。
--------

其实WordPress一个非常有效的方法就是使用数据库缓存,无论是Redis或者是Memcached都可以很大程度上提高速度。我基本上只要开启Redis和PHP7就非常快了~

嗯嗯嗯,缓存确实很有用。WP-Super-Cache的mod_rewrite缓存模式能直接生成HTML文件,直接绕过了PHP解析和数据库查询,理论上比单独的数据库和PHP缓存效率更高。但是对于未备案的国外主机来说,主要瓶颈是网络传输速度,减小网站文件大小和加快静态资源加载对网站的整体速度提升效果非常明显。

No comments:

Post a Comment