看到论坛某大佬发的,估计很多人需要,故发之如下:

引子:
        这几天遇到一个网站优化小难题,老板说首页加载速度太慢了想给网站提提速. 我第一反应就是加个缓存插件,但是公司后端采用的TP3.1.1明确不支持任何缓存。
        所以只能在前端上动一动,想到之前天毅大佬帮我博客装过的ngx_pagespeed模块.但是由于宝塔面板的环境目录与LNMP的不同,当时还折腾了一段时间。
        公司网站也是宝塔的LNMP环境,现在自己搞其实心里挺没底的,不过自己在测试后发现,相比于在军哥的lnmp一键包上安装pagespeed,在宝塔面板上搞更简单。


宝塔服务器面板,一键全能部署及管理,送你3188元礼包,点我领取



Ngx_Pagespeed模块简介
        ngx_pagespeed 是 Nginx 的一个扩展模块,主要的功能是针对前端页面而进行服务器端的优化,对前端设计人员来说,可以省去优化css、js以及图片的过程。
        ngx_pagespeed对nginx自身负载能力的提升基本是看不到的,甚至会因为进行服务器端的优化而使系统增加负载;
        但从减少客户请求数的角度去看,牺牲部分服务器性能还是值得的。 

ngx_pagespeed模块的主要功能如下:


图像优化:剥离元数据、动态调整,重新压缩
CSS和JavaScript压缩、合并、级联、内联
小资源内联
推迟图像和JavaScript加载
对HTML重写、压缩空格、去除注释等
提升缓存周期



让我觉得最有用的就是:图像的优化,他可以把你的图片压缩并转为webp格式,对于首页图片较多的网站有较大的优化作用。

Ngx_PageSpeed模块的安装:

实验环境为:  系统: Debian8 64位  管理面板: 宝塔5.9免费版 环境: nginx 1.14 编译安装

首先要说明的是pagespeed官网提供全自动安装,但并不适合各种一键环境,所以只能采用手动安装。

这里我自己做了个脚本,在实验环境下通过了编译,可以通过下面一行命令进行调用:

  1. wget https://github.com/madlifer/ngx_pagespeed_auto/releases/download/v0.0.1/nps-auto.sh && bash nps-auto.sh

复制代码



声明

脚本来源参考了模块官网,脚本命令参考了Linpx,ZhangGe,脚本流程参考了nanqinlang,但由于自身Shell水平不行,脚本里仍然还是 full of trash. 强烈不建议用于生产环境。

为网站配置该模块


将下面的命令粘贴于 网站-域名-配置文档- 域名下方 并保存 即可启用

  1. # 启用ngx_pagespeed    

  2. pagespeed on;    

  3. pagespeed FileCachePath /tmp/cache/ngx_pagespeed_cache;    

  4. # 禁用CoreFilters    

  5. pagespeed RewriteLevel PassThrough;    

  6. # 启用压缩空白过滤器    

  7. pagespeed EnableFilters collapse_whitespace;    

  8. # 启用JavaScript库卸载    

  9. pagespeed EnableFilters canonicalize_javascript_libraries; #谷歌被墙,并不确定这个设置有没有副作用 

  10. # 把多个CSS文件合并成一个CSS文件    

  11. pagespeed EnableFilters combine_css;    

  12. # 把多个JavaScript文件合并成一个JavaScript文件    

  13. pagespeed EnableFilters combine_javascript;    

  14. # 删除带默认属性的标签    

  15. pagespeed EnableFilters elide_attributes;    

  16. # 改善资源的可缓存性    

  17. pagespeed EnableFilters extend_cache;    

  18. # 更换被导入文件的@import,精简CSS文件    

  19. pagespeed EnableFilters flatten_css_imports;    

  20. pagespeed CssFlattenMaxBytes 5120;    

  21. # 延时加载客户端看不见的图片    

  22. pagespeed EnableFilters lazyload_images;    

  23. # 启用JavaScript缩小机制    

  24. pagespeed EnableFilters rewrite_javascript;    

  25. # 启用图片优化机制    

  26. pagespeed EnableFilters rewrite_images;    

  27. # 预解析DNS查询    

  28. pagespeed EnableFilters insert_dns_prefetch;    

  29. # 重写CSS,首先加载渲染页面的CSS规则    

  30. pagespeed EnableFilters prioritize_critical_css; 

  31. # Example 禁止pagespeed 处理/wp-admin/目录(可选配置,可参考使用)

复制代码





这是个老东西,但确实挺有用的,还是有很多博客站长都没部署,所以简化了一下操作,第一个shell脚本,别喷我就行

希望有大佬可以完善脚本:  

https://github.com/madlifer/ngx_pagespeed_auto/


评论专区
  • 昵 称必填
  • 邮 箱必填
  • 网 址选填
◎已有 0 人评论
作者介绍
吕布

吕布

负责所有栏目的编辑工作。
80vps henghost
budgetvm sugarhosts
点击关闭
  • 在线客服1

    在线客服2

    在线客服3

分享:

支付宝

微信