Nginx 部署 PageSpeed 模块

Mar 13, 2018HTTP

pagespeed

ngx_pagespeed 是Google 推出的一个 Nginx 的扩展模块，可以加速网站，减少页面加载时间，自动将一些提升web性能的实践应用到网页和相关的资源（CSS、JS和图片）上，无需修改内容和流程。

讲道理，PageSpeed 中的优化项目我本身已经使用了不少，根本用不上部署PageSpeed，但是抱着学习的态度，我还是尝试部署了一番，踩坑那也是必然的。

安装

下载最新版本的压缩包并解压，实际上编译pagespeed 还需要下载psol 依赖模块，不同版本的psol 不同，如果没找到psol 会打印出你如何下载相应的模块。

wget https://github.com/pagespeed/ngx_pagespeed/archive/latest-beta.tar.gz
tar xzf latest-beta.tar.gz

下载最新版本的Nginx 并解压

wget --no-check-certificate -c http://nginx.org/download/nginx-1.13.9.tar.gz
tar xzf nginx-1.13.9.tar.gz
cd nginx-1.13.9

使用nginx -V 查看之前安装nginx的编译信息并在末尾加上下面这段

--add-module=../ngx_pagespeed-latest-beta

添加完大致如下

./configure --prefix=/usr/local/nginx --user=www --group=www --with-http_stub_status_module --with-http_v2_module --with-http_ssl_module --with-http_gzip_static_module --with-openssl=../openssl-1.0.2k --with-pcre=../pcre-8.39 --add-module=../ngx_pagespeed-latest-beta

这时会提示checking for psol ... not found，并提示你如何操作，操作如下，注意版本号可能不同。

cd ngx_pagespeed-latest-beta/
wget https://dl.google.com/dl/page-speed/psol/1.12.35.2-x64.tar.gz
tar xzf 1.12.34.2-x64.tar.gz

如果操作完成后仍然提示checking for psol ... not found，非常可能的原因是你的GCC版本太低，这时候只能重新编译升级更至4.8以上版本。

之后常规操作并验证是否安装成功

make
mv /usr/local/nginx/sbin/nginx{,_date +%F}
cp objs/nginx /usr/local/nginx/sbin
nginx -V 2>&1 | grep -o ngx_pagespeed

配置

官网官网列出了最使用的参数配置，下面的配置文件可供简单参考。

server {
    # on 启用，off 关闭
    pagespeed on;

    # 重置 http Vary 头
    pagespeed RespectVary on;

    # html字符转小写
    pagespeed LowercaseHtmlNames on;

    # 压缩带 Cache-Control: no-transform 标记的资源
    pagespeed DisableRewriteOnNoTransform off;

    # 相对URL
    pagespeed PreserveUrlRelativity on;

    pagespeed XHeaderValue “Powered By Fatesinger.com”;

    # 开启 https
    pagespeed FetchHttps enable;

    # 配置服务器缓存位置和自动清除触发条件，缓存文件夹如果不存在则需要自行创建，建议放在内存中
    pagespeed FileCachePath “/dev/shm/ngx_pagespeed/”;
    pagespeed FileCacheSizeKb 2048000;
    pagespeed FileCacheCleanIntervalMs 43200000;
    pagespeed FileCacheInodeLimit 500000;

    # 过滤规则
    pagespeed RewriteLevel PassThrough;

    # 过滤WordPress的/wp-admin/目录(可选配置，可参考使用)
    pagespeed Disallow "*/wp-admin/*";
    pagespeed Disallow "*/wp-login.php*";

    # 移除不必要的url前缀，开启可能会导致某些自动加载功能失效
    #pagespeed EnableFilters trim_urls;

    # 移除 html 空白
    pagespeed EnableFilters collapse_whitespace;

    # 移除 html 注释
    pagespeed EnableFilters remove_comments;

    # DNS 预加载
    pagespeed EnableFilters insert_dns_prefetch;

    # 压缩CSS
    pagespeed EnableFilters rewrite_css;

    # 合并CSS
    pagespeed EnableFilters combine_css;

    # 重写CSS，优化加载渲染页面的CSS规则
    pagespeed EnableFilters prioritize_critical_css;

    # 压缩js
    pagespeed EnableFilters rewrite_javascript;

    # 合并js
    pagespeed EnableFilters combine_javascript;

    # 优化内嵌样式属性
    pagespeed EnableFilters rewrite_style_attributes;

    # 压缩图片
    pagespeed EnableFilters rewrite_images;

    # 不加载显示区域以外的图片
    pagespeed LazyloadImagesAfterOnload off;

    # 图片预加载
    pagespeed EnableFilters inline_preview_images;

    # 移动端图片自适应重置
    pagespeed EnableFilters resize_mobile_images;

    # 图片延迟加载
    pagespeed EnableFilters lazyload_images;

    # 扩展缓存 改善页面资源的可缓存性
    pagespeed EnableFilters extend_cache;

    location ~ "\.pagespeed\.([a-z]\.)?[a-z]{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; }
}

以上配置非常有用的如合并压缩js css文件，移除空白和相对URL，图片优化之类的则根据服务器性能酌情开启。