散尽浮华

tangbinde 发表于 2017-12-22 18:39:28

　　ngx_pagespeed是Nginx的一个扩展模块，借助pagespeed,为Nginx网站服务器提速。主要的功能是针对前端页面而进行服务器端的优化，对前端设计人员来说，可以省去优化css、js以及图片的过程。
　　ngx_pagespeed对nginx自身负载能力的提升基本是看不到的，甚至会因为进行服务器端的优化而使系统增加负载；但从减少客户请求数的角度去看，牺牲部分服务器性能还是值得的。
　　ngx_pagespeed模块的主要功能大致有：
　　1）图像优化：剥离元数据、动态调整，重新压缩
　　2）CSS和JavaScript压缩、合并、级联、内联
　　3）小资源内联
　　4）推迟图像和JavaScript加载
　　5）对HTML重写、压缩空格、去除注释等
　　6）提升缓存周期
　　作为Nginx组件，ngx_pagespeed将重写你的网页，让用户以更快的速度进行访问。重写的工作包括压缩图片、缩减CSS和JavaScript、扩展缓存时间，同样还包括其它一些最佳实践：
　　1）优化缓存----整合应用程序的数据和逻辑
　　2）最小化round-trip次数----削减连续的请求/响应周期数
　　3）最小化请求开销----削减上传大小
　　4）最小化负载大小----削减响应、下载及缓存页面大小
　　5）优化浏览器渲染----改善浏览器页面布局
　　6）移动方面的优化----优化站点移动网络和设备方面的相关特性
　　温馨小提示：
　　ngx_pagespeed环境安装：模块是一个开源模块，功能上与mod_pagespeed（Apache前端加速模块）相比稍有欠缺。Github上针对ngx_pagespeed Bugs的反馈更新很频繁，基本上都能很快得到解决，要是部署在生产环境需要谨慎。
　　另，系统内GCC版本必须大于4.2。ngx_pagespeed更新频率较高，建议及时更新到最新版本，而且最好先部署在本地环境中，经过一番测试稳定后再上线生产环境。
　　PageSpeed旨在缩短网页加载的时间，减少网站服务器的带宽使用量。
　　PageSpeed模块可以使用数量众多的重写"过滤器"，每个过滤器都可以选择性地开启/关闭，从而自动进行各种优化（比如，减小文档大小、减少HTTP请求数据、减少HTTP往返次数以及缩短DNS解析时间）。
　　下面是ngx_pagespeed支持的其中一些过滤器，想了解支持的全部过滤器，请参阅官方文档。
　　

1）Collapse Whitespace（压缩空白）：通过把HTML网页中的多处连续空白换成一处空白，减少带宽使用量。　　
2）Canonicalize JavaScript Libraries（规范化转换JavaScript库）：通过自动把流行的JavaScript库换成免费托管的JavaScript库（比如由谷歌托管），减少带宽使用量。
　　
3）Combine CSS（合并CSS）：通过把多个CSS文件合并成一个CSS文件，减少HTTP请求数量。
　　
4）Combine JavaScript（合并JavaScript）：通过把多个JavaScript文件合并成一个JavaScript文件，减少HTTP请求数量。
　　
5）Elide Attributes（省略属性）：通过删除由默认属性指定的标签，缩小文档大小。
　　
6）Extend Cache（扩展缓存）：通过优化网页资源的可缓存性，减少带宽使用量。
　　
7）Flatten CSS Imports（精简CSS导入）：通过删除CSS文件中的@import，减少HTTP请求往返次数。
　　
8）Lazyload Images（延时加载图片）：延时加载在客户端浏览器上看不见的图片。
　　
9）Minify JavaScript（缩小JavaScript）：通过缩小JavaScript，减少带宽使用量。
　　
10）Optimize Images（优化图片）：通过引入更多的内嵌图片、压缩图片，或者将GIF图片转换成PNG图片，优化图片分发。
　　
11）Pre-Resolve DNS（预解析DNS）：通过预解析DNS，缩短DNS解析时间。
　　
12）Prioritize Critical CSS（优化加载关键CSS规则）：重写CSS文件，以便首先加载渲染页面的CSS规则。
　　

　　

　　与Apache网站服务器不一样，Nginx模块无法在运行时动态加载，而是必须在编译时加载。ngx_pagespeed模块并未内置在随主要Linux发行版（比如Fedora 19）发布的Nginx程序包中，所以说想使用Nginx中的PageSpeed，必须利用源代码来构建Nginx。
　　ngx_pagespeed环境安装：（提前yum install gcc-c++ pcre-devel zlib-devel make wget ）
　　相关包下载地址：https://pan.baidu.com/s/1dFCCleL
　　提取密码：h7ku
　　

# cd /usr/local/src/　　
# wget https://github.com/pagespeed/ngx_pagespeed/archive/release-1.6.29.5-beta.zip

　　
# unzip>　　
# cd ngx_pagespeed-release-1.6.29.5-beta/
　　
# wget https://dl.google.com/dl/page-speed/psol/1.6.29.5.tar.gz
　　
# tar -zvxf 1.6.29.5.tar.gz
　　

　　

　　然后重新编译nginx，编译时跟上--add-module= /usr/local/src/ngx_pagespeed-release-1.6.29.5-beta模块参数
　　

cd nginx-1.9.7　　
./configure --prefix=/usr/local/nginx --user=www --group=www --with-http_ssl_module --with-http_flv_module --with-http_stub_status_module --with-http_gzip_static_module --with-pcre --add-module= /usr/local/src/ngx_pagespeed-release-1.6.29.5-beta
　　
make && make install
　　

　　

　　使用ngx_pagespeed
　　

# mkdir /var/ngx_pagespeed_cache　　
# chown www.www /var/ngx_pagespeed_cache //www是nginx服务启动用户
　　
# cp /usr/local/nginx/conf/nginx.conf /usr/local/nginx/conf/nginx.conf.bak
　　
# vim/usr/local/nginx/conf/nginx.conf
　　
........
　　
server {
　　
........
　　
# 启用ngx_pagespeed
　　
pagespeed on;
　　
pagespeed FileCachePath /var/ngx_pagespeed_cache;
　　
# 启用CoreFilters
　　
pagespeed RewriteLevel CoreFilters;
　　
# 禁用CoreFilters中的某些过滤器
　　
pagespeed DisableFilters rewrite_images;
　　
# 选择性地启用额外的过滤器
　　
pagespeed EnableFilters local_storage_cache;
　　
pagespeed EnableFilters collapse_whitespace,remove_comments;
　　
pagespeed EnableFilters outline_css;
　　
pagespeed EnableFilters flatten_css_imports;
　　
pagespeed EnableFilters move_css_above_scripts;
　　
pagespeed EnableFilters move_css_to_head;
　　
pagespeed EnableFilters outline_javascript;
　　
pagespeed EnableFilters combine_javascript;
　　
pagespeed EnableFilters combine_css;
　　
pagespeed EnableFilters rewrite_javascript;
　　
pagespeed EnableFilters rewrite_css,sprite_images;
　　
pagespeed EnableFilters rewrite_style_attributes;
　　
pagespeed EnableFilters recompress_images;
　　
pagespeed EnableFilters resize_images;
　　
pagespeed EnableFilters convert_meta_tags;
　　
location ~ "\.pagespeed\.(\.)?{2}\.[^.]{10}\.[^.]+" { add_header "" ""; }
　　
location ~ "^/ngx_pagespeed_static/" { }
　　
location ~ "^/ngx_pagespeed_beacon$" { }
　　
location /ngx_pagespeed_statistics { allow 127.0.0.1; deny all; }
　　
location /ngx_pagespeed_message { allow 127.0.0.1; deny all; }
　　
.......
　　
}
　　
# /usr/local/nginx/sbin/nginx -t
　　
# /usr/local/nginx/sbin/nginx
　　

　　

　　可以参阅官方文档CoreFilters中的过滤器。

页: [1]

运维网's Archiver

散尽浮华