faviconngx_pagespeed使用指南

什么是ngx_pagespeed?

介绍ngx_pagespeed之前,先来介绍什么是pagespeed?

pagespeed全称为PageSpeed modules,谷歌官方的解释为:The PageSpeed modules are open-source server modules that optimize your site automatically.一款开源的服务器模块,用来自动优化网站的。

PageSpeed modules可用于Web服务器软件ApacheNginx,而ngx_pagespeed就是PageSpeed用于Nginx的模块名称。

安装ngx_pagespeed

以下是谷歌官方给出的安装ngx_pagespeed方法:

安装依赖软件

RedHat, CentOS, or Fedora
sudo yum install gcc-c++ pcre-devel zlib-devel make unzip
Ubuntu or Debian
sudo apt-get install build-essential zlib1g-dev libpcre3 libpcre3-dev unzip

下载ngx_pagespeed

cd
NPS_VERSION=1.10.33.6
wget https://github.com/pagespeed/ngx_pagespeed/archive/release-${NPS_VERSION}-beta.zip -O release-${NPS_VERSION}-beta.zip
unzip release-${NPS_VERSION}-beta.zip
cd ngx_pagespeed-release-${NPS_VERSION}-beta/
wget https://dl.google.com/dl/page-speed/psol/${NPS_VERSION}.tar.gz
tar -xzvf ${NPS_VERSION}.tar.gz 

编译安装Nginx和ngx_pagespeed

cd
# 浏览http://nginx.org/en/download.html获取Nginx最新版本号
NGINX_VERSION=1.8.1
wget http://nginx.org/download/nginx-${NGINX_VERSION}.tar.gz
tar -xvzf nginx-${NGINX_VERSION}.tar.gz
cd nginx-${NGINX_VERSION}/
./configure --add-module=$HOME/ngx_pagespeed-release-${NPS_VERSION}-beta ${PS_NGX_EXTRA_FLAGS}
make
sudo make install

可以看出,Nginx在编译时通过--add-module=来添加模块,后面的模块目录可以自定义。

以上安装编译过程翻译自谷歌官方,如有变动请浏览原文

使用ngx_pagespeed

安装完成后,我们就可以使用ngx_pagespeed来加速网站。

ngx_pagespeed有一系列功能不同的配置参数,主要有以下几类:

  • 图片优化:剥离元数据、动态调整大小、再次压缩等。
  • CSS与JavaScript压缩、合并、内嵌等。
  • 小型资源内联。
  • 延缓图片和JavaScript加载。
  • HTML重写。
  • 缓存存活期扩展。
  • 等等……

在Nginx中使用ngx_pagespeed时,可以在nginx配置文件(.conf)中通过include来包含ngx_pagespeed配置文件(.conf),而将所有的ngx_pagespeed参数项都写入ngx_pagespeed配置文件以便于管理配置。

以我的个人网站为例,在我的Nginx配置文件alair.conf中添加以下代码:

include /usr/local/nginx/config/ps.conf

以下是我的ps.conf配置文件示例:

pagespeed on;
pagespeed FileCachePath /usr/share/ps;
pagespeed RewriteLevel PassThrough;
pagespeed EnableFilters collapse_whitespace;
pagespeed EnableFilters canonicalize_javascript_libraries;
pagespeed EnableFilters combine_css;
pagespeed EnableFilters combine_javascript;
pagespeed EnableFilters elide_attributes;
pagespeed EnableFilters extend_cache;
pagespeed EnableFilters flatten_css_imports;
pagespeed CssFlattenMaxBytes 5120;
pagespeed EnableFilters lazyload_images;
pagespeed EnableFilters rewrite_javascript;
pagespeed EnableFilters rewrite_images;
pagespeed EnableFilters insert_dns_prefetch;
pagespeed EnableFilters prioritize_critical_css;

参考以上设置完成后,重新加载Nginx配置service nginx reload即可生效

在此推荐麦葱开发的Chrome插件HTTP Status,通过该插件可以查看当前网站HTTP状态,进而可以判断出ngx_pagespeed是否配置生效。我的HTTP状态如下:
HTTP状态