Google +1按钮速度的最佳化

最近工作达人又龟速了,前几天中华电信的网路频宽才刚从十二M/四M提升到二十M/五M,现在怎么还是龟呢?只好再从WordPress的最佳化下手,当然第一招先从网站大小着手,因为网页内容中常包含有大量的图片、Flash 或是 Javascript 内容,因此需要下载大量的档案导致慢速,建议保持一个页面的大小在 100KB以下,可以的话最好在 50KB以内,这这…有点天方夜谭了,所以我们跑了一下GTmetrix看看:

[adsense][/adsense]

环境是这样:

Test Server Region: Vancouver, Canada
Using: Firefox (Desktop) 14.0.1, Page Speed 1.12.16, YSlow 3.1.6

2013-05-10_133754

Page Speed做得还不错,有A等级,但是YSlow却是D等级,这早已是不争的事实了,而且很多是来自他站的连结或图片,根本几乎无从改变,除非就是不连,但是不连可能就得跟赚钱的广告命脉做切割了,还真左右为难啊,不过我们还是看看到底为什么会是D了。

2013-05-10_135258

Add Expires headers被列为头号敌人,点进去报告说‘There are 87 static components without a far-future expiration date.’,87笔要一一解决是个大工程啊,想想也不是一朝一夕就可以解决完的,先看看第一项吧,我的网站这个http://apis.google.com/js/plusone.js使用竟然是降速的第一要因,所以刘子就查了一下plusone.js的问题,查到了这篇Optimizing the Google +1 button for speed,ㄚ琪照着他的第一个方法测试,虽然他的问题还是挂在YSlow的问题上,但是就速度来说因为已经可以从cache读取相形之下速度真的快了,前后的照片我们比较一下吧:

2013-05-09_111453

这是2013年5月9日, 上午 11:14:57未经改善的plusone.js,这里问题就是使用http://apis.google.com/js/plusone.js,我们就开始侦查了为什么工作达人上有使用这样的档案,追踪到了Sociable这个外挂的sociable.php里的sociable_init_async函式有这样一行:

echo “</script><script type=’text/javascript’ src=’http://apis.google.com/js/plusone.js’></script>”;

我们多加了一个s:

echo “</script><script type=’text/javascript’ src=’https://apis.google.com/js/plusone.js’></script>”;

之后进行测试:

2013-05-09_152610

2013年5月9日, 下午 03:26:20 看看他的Size已经可以from cache了。

再反覆看个几次:

2013-05-09_154021

2013-05-09_154314

速度上有差异,但是这一次没有from cache了。

2013-05-09_154916 2013-05-09_154314

这一次的速度差距更大,从6.56s降到704ms

总之,这个Save a step, Use Https这个法子是可行。

而Don’t load the script on Mobile devices、Load the plusone.js script asynchronously、Host the plusone.js file yourself等方法,我想问题是出在Sociable这个外挂,所以也不能要求所有的Wordpress的使用者都改成这样的方式吧,先省略了,等外挂作者想到再说。