WordPress启用Nginx PageSpeed模块来加速网站

543
PageSpeed

最近在研究如何提升网站访问速度,发现一个神奇的网站:PageSpeed Insights,这是谷歌专门为站长查看网页优化程度而开发的工具:

通过该工具可以看到我们的网站还有多少优化空间,并且相应给出了优化建议,从建议中发现了其推荐的针对 Nginx 的 ngx_pagespeed 模块和针对 Aapche 的 mod_pagespeed 模块,介绍为:

Pagespeed 可以自动优化网页和关联资源(CSS,JavaScript,图片),缩短网页的加载时间,而无需修改现有内容或工作流程,实现加快网站的的速度。

  • 图片:剥离元数据、动态调整;
  • CSS:压缩、合并、级联、小资源内联;
  • JavaScript:

接下来我们就安装这个模块看看优化效果如何。以下操作基于宝塔平台,同样适用于LNMP 等平台,区别于操作目录而已。

下载源码

确认运行库是否安装完整:

进入 Nginx 源码目录下载:

注:1.13.35.2 是版本号,在这里 可以看到。
psol 下载地址在 1.12.34 后发生变动了,如果是这版本之前,下载地址是:
https://dl.google.com/dl/page-speed/psol/版本号.tar.gz
例如::https://dl.google.com/dl/page-speed/psol/1.12.33.2.tar.gz
这个版本之后则是:
https://dl.google.com/dl/page-speed/psol/版本号-x系统位数.tar.gz
例如:https://dl.google.com/dl/page-speed/psol/1.13.35.2-x64.tar.gz

重新编译

通过 nginx -V 获得原先的编译参数:

在原先编译参数基础上,尾巴添加 --add-module=./src/incubator-pagespeed-ngx-1.13.35.2-stable 重新编译

配置启用

PageSpeed 会产生缓存文件,因此开启配置缓存文件夹,文件夹位置随意,这里我放在 /www/server/nginx/pagespeed_temp:

由于每个站点情况不一样,故在每个站点(server{})分别启用(全局 [http{}] 估计也是可以的),参数及含义如下:

更多参数参考:《PageSpeed Documentation

访问验证

以上我们已经成功启用 PageSpeed 模块,接下来我们验证一下:

回应标头:

启用前:

启用后

可以看到响应头包含了 X-Page-Speed: Powered By VirCloud, LLC. 字样,而 X-Page-Speed 正是 PageSpeed 启用标志,可见已成功启用,那么效果如何呢?

名词解释:

  • DOMContentLoaded:浏览器已经完全加载了 HTML,DOM 树已经构建完毕,但是像是 img 和样式表等外部资源可能并没有下载完毕。
  • Load:浏览器已经加载了所有的资源(图像,样式表等)。

发表评论