借助PageSpeed,为Nginx网站服务器提速

网站加载速度越快，访客互动性、留住率和转换率就越高，这早已不是什么秘密。网站每延迟 100 毫秒，亚马逊的销售额就会减少 1%；延迟增加 500 毫秒，这意味着谷歌的流量和收入就会减少 20%。要是有一个办法可以为你的网站服务器提速，又不必升级到功能更强大的服务器，就没有理由不试一试这个办法。

我在本教程中将介绍如何优化 Nginx 网站服务器，以提升其性能。虽然 Nginx 网站服务器本身已俨然成为运行速度最快、可扩展性最佳的网站服务器之一，但是仍有众多方法可以调整优化其常规安装系统的性能。

举例说，有一个由谷歌开发的网站服务器模块，名为 PageSpeed 模块（https://developers.google.com/speed/pagespeed/module）。PageSpeed 旨在缩短网页加载的时间，减少网站服务器的带宽使用量。最近，已发布了 Nginx 版本的 PageSpeed 模块（ngx_pagespeed）。作为一种有望为 Nginx 网站服务器提速的可行方法，我将演示如何在 Nginx 中启用并配置 ngx_pagespeed 模块。

PageSpeed 的功能特性

PageSpeed 模块可以使用数量众多的重写”过滤器”，每个过滤器都可以选择性地开启/关闭，从而自动进行各种优化（比如，减小文档大小、减少 HTTP 请求数据、减少 HTTP 往返次数以及缩短 DNS 解析时间）。

下面是 ngx_pagespeed 支持的其中一些过滤器。想了解支持的全部过滤器，请参阅官方文档。

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

与 Apache 网站服务器不一样，Nginx 模块无法在运行时动态加载，而是必须在编译时加载。截至本文截稿时，ngx_pagespeed 模块并未内置在随主要 Linux 发行版（比如 Fedora 19）发布的 Nginx 程序包中。因而，想使用 Nginx 中的 PageSpeed，你需要利用源代码来构建 Nginx。

借助 ngx_pagespeed，构建和安装 Nginx

安装用于构建 nginx 和 ngx_pagespeed 的必备要素。

在 Debian、Ubuntu 或 Linux Mint 上：

1	$ sudo apt–get install build–essential zlib1g–dev libpcre3–dev

在 Fedora、CentOS 或 RHEL 上：

1	$ sudo yum install gcc–c++ pcre–devel zlib–devel make wget

下载并安装 ngx_pagespeed 源代码，如下所示。

ngx_pagespeed 会被解压缩到/usr/local/nginx/modules/ngx_pagespeed-1.7.30.3-beta

$ sudo mkdir –p /usr/local/nginx/modules

$ wget https://github.com/pagespeed/ngx_pagespeed/archive/v1.7.30.3–beta.tar.gz

$ sudo tar xvfvz v1.7.30.3–beta.tar.gz –C /usr/local/nginx/modules —no–same–owner

下载预构建的 PSOL（PageSpeed 优化库，https://developers.google.com/speed/pagespeed/psol），并将它安装到 ngx_pagespeed 目录下：

$ wget https://dl.google.com/dl/page–speed/psol/1.7.30.3.tar.gz

$ sudo tar xvfvz 1.7.30.3.tar.gz –C /usr/local/nginx/modules/ngx_pagespeed–1.7.30.3–beta —no–same–owner $ sudo find /usr/local/nginx/modules/ngx_pagespeed–1.7.30.3–beta/ –type d –exec chmod +rx {} ;

$ sudo find /usr/local/nginx/modules/ngx_pagespeed–1.7.30.3–beta/ –type f –exec chmod +r {} ;

从 http://nginx.org/en/download.html，下载 Nginx 的最新稳定版。

1	$ wget http://nginx.org/download/nginx–1.4.4.tar.gz

最后，在 ngx_pagespeed 模块启用的情况下，编译 Nginx，并安装它，如下所示。

$ tar xvfvz nginx–1.4.4.tar.gz $ cd nginx–1.4.4

$ ./configure —add–module=/usr/local/nginx/modules/ngx_pagespeed–1.7.30.3–beta —prefix=/usr/local/nginx —sbin–path=/usr/local/sbin/nginx —conf–path=/etc/nginx/nginx.conf —error–log–path=/var/log/nginx/error.log —http–log–path=/var/log/nginx/access.log —pid–path=/run/nginx.pid —lock–path=/run/lock/subsys/nginx —user=nginx —group=nginx

$ make

$ sudo make install

你应该确认，ngx_pagespeed 模块已添加到安装的 Nginx 系统上，如下所示。

$ /usr/local/nginx/sbin/nginx –V nginx version: nginx/1.4.4 built by gcc 4.8.2 20131212 (Red Hat 4.8.2–7) (GCC) configure arguments: —add–module=/usr/local/nginx/modules/ngx_pagespeed–1.7.30.3–beta . . . .

配置 Nginx 中的 ngx_pagespeed 模块

想启用并配置 ngx_pagespeed，就要编辑 Nginx 配置的 server 部分。nginx.conf 的下面这个示例表明了如何指定一个或多个 PageSpeed 过滤器。

$ sudo vi /etc/nginx/nginx.conf

server {

# 侦听的端口

listen 80;

# 服务器名称

server_name xmodulo.com www.xmodulo.com;

# 记下根目录

root /usr/local/nginx/html;

# 访问日志

access_log /var/log/nginx/access.log main;

# 启用ngx_pagespeed

pagespeed on;

# 在此放置一个或多个pagespeed过滤器。

}

说到指定 PageSpeed 过滤器，有两种不同的级别可供你选择：CoreFilters 和 PassThrough。除非有所指定，否则默认情况下使用 CoreFilters。

对新手用户而言：使用 CoreFilters

CoreFilters 含有一系列 PageSpeed 过滤器，谷歌认为这些过滤器对大多数网站来说是安全的。如果启用 CoreFilters，你就自动启用了一系列”安全”规则。所以，推荐新手用户采用这种方法。如果你愿意，也可以禁用 CoreFilters 中的某个或某些过滤器，或者选择性地启用额外的过滤器。下面这个例子表明了使用 CoreFilters 的 ngx_pagespeed 配置。

server {

# 侦听的端口

listen 80;

# 服务器名称

server_name xmodulo.com www.xmodulo.com;

# 记下根目录

root /usr/local/nginx/html;

# 访问日志

access_log /var/log/nginx/access.log main;

# 启用ngx_pagespeed

pagespeed on;

pagespeed FileCachePath /var/ngx_pagespeed_cache;

# 启用CoreFilters

pagespeed RewriteLevel CoreFilters;

# 禁用CoreFilters中的某些过滤器

pagespeed DisableFilters rewrite_images;

# 选择性地启用额外的过滤器

pagespeed EnableFilters collapse_whitespace;

pagespeed EnableFilters lazyload_images;

pagespeed EnableFilters insert_dns_prefetch;

}

想了解 CoreFilters 中的全部过滤器，请参阅官方文档。

对高级用户而言：使用 PassThrough

如果是高级用户，你可以使用 PageThrough 级别，你可以手动启用个别过滤器。

server {

# 侦听的端口

listen 80;

# 服务器名称

server_name xmodulo.com www.xmodulo.com;

# 记下根目录

root /usr/local/nginx/html;

# 访问日志

access_log /var/log/nginx/access.log main;

# 启用ngx_pagespeed

pagespeed on;

pagespeed FileCachePath /var/ngx_pagespeed_cache;

# 禁用CoreFilters

pagespeed RewriteLevel PassThrough;

# 启用压缩空白过滤器

pagespeed EnableFilters collapse_whitespace;

# 启用JavaScript库卸载

pagespeed EnableFilters canonicalize_javascript_libraries;

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

pagespeed EnableFilters combine_css;

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

pagespeed EnableFilters combine_javascript;

# 删除带默认属性的标签

pagespeed EnableFilters elide_attributes;

# 改善资源的可缓存性

pagespeed EnableFilters extend_cache;

# 更换被导入文件的@import，精简CSS文件

pagespeed EnableFilters flatten_css_imports;

pagespeed CssFlattenMaxBytes 5120;

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

pagespeed EnableFilters lazyload_images;

# 启用JavaScript缩小机制

pagespeed EnableFilters rewrite_javascript;

# 启用图片优化机制

pagespeed EnableFilters rewrite_images;

# 预解析DNS查询

pagespeed EnableFilters insert_dns_prefetch;

# 重写CSS，首先加载渲染页面的CSS规则

pagespeed EnableFilters prioritize_critical_css;

}

另外的配置步骤：

创建将由 Nginx 写入的一个文件缓存目录。

1 2	$ sudo mkdir /var/ngx_pagespeed_cache $ sudo chown nginx:nginx /var/ngx_pagespeed_cache

为了方便起见，为 Nginx 创建一个初始化脚本。

$ wget https://github.com/MovLib/www/raw/master/bin/init–nginx.sh

$ sudo mv init–nginx.sh /etc/init.d/nginx

$ sudo chmod 0755 /etc/init.d/nginx

最后，启动 Nginx。

1	$ sudo /etc/init.d/nginx start

注意：除了 ngx_pagespeed 外，你可能还需要定义额外的 Nginx 模块（比如 HTTPS/SSL 支持等），具体视需求而定。这种情况下，你需要在 Nginx 编译这个环节来添加这些模块。请参阅这篇教程（http://xmodulo.com/2014/01/compile-install-nginx-web-server.html），了解如何启用额外的 Nginx 模块。