- A+
最近在研究如何提升网站访问速度,发现一个神奇的网站: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:浏览器已经加载了所有的资源(图像,样式表等)。