记录使用pagespeed模块优化wordpress的过程

这里是的pagespeed是一个web服务器插件,支持 nginx 和 apache 。 因为这个网站是在nginx下运行的。这里记录一下优化的效果。

详细的文档可以在 https://www.modpagespeed.com/doc/ 找到。 这里就是简单的测试一下,看看对网站的提升有多大的影响。

配置文件

pagespeed on;
pagespeed FileCachePath "/var/cache/pagespeed/";

pagespeed PreserveUrlRelativity off;
pagespeed EnableFilters lazyload_images;
pagespeed LazyloadImagesAfterOnload off;
pagespeed LazyloadImagesBlankUrl "https://www.gstatic.com/psa/static/1.gif";

pagespeed EnableFilters resize_rendered_image_dimensions;

配置文件做了什么事情

首先开启了 pagespeed 。 让 pagespeed 默认的运行,默认运行好像图片不会延迟加载,所有配置信息添加了图片处理的一些功能。

效果对比

随手找了一个企业网站做了测试,不一定有代表性,是个wordpress 程序。

首屏数据测试

# 启用后的数据
28 个请求
已传输 537 kB
922 kB 项资源
完成用时:879 毫秒
DOMContentLoaded:558 毫秒
加载时间:795 毫秒

# 启用前的数据
35 个请求
已传输 1.4 MB
1.6 MB 项资源
完成用时:1.91 秒
DOMContentLoaded:440 毫秒
加载时间:1.83 秒

发现提升的还是非常多的。这个插件是挺赞的。

看看都修改什么东西

webp
  1. 图片都变成了 webp 格式的,这样网站的图片,就小了很多
  2. 图片支持延迟加载,这样首屏就会打开的更快
  3. css 文件也被优化了
  4. 当然其他的还有很多...

总的说对于一些老的网站性能的提升,还是非常有帮助的,如果网站制作的时候就非常注意性能,则帮助不是很大。因为这些东西都可以手动的完成,就是工作量比较多一点。