PageSpeed Nginx 加速模块教程

ngx_pagespeed 是 Google 开发的 Nginx 模块,能够自动对网页内容进行优化,包括压缩合并 CSS/JS、延迟加载图片、内联关键 CSS、转换图片格式等。它在服务器端透明地完成这些优化,无需修改网站源代码。本文将介绍在搬瓦工 VPS 上编译安装和配置 PageSpeed 模块。

一、编译安装

1.1 安装依赖

apt update
apt install build-essential libpcre3-dev zlib1g-dev libssl-dev \
  unzip uuid-dev -y

1.2 下载 PageSpeed 模块

cd /usr/src

# 下载 ngx_pagespeed 模块
NPS_VERSION=1.14.36.1
wget https://github.com/apache/incubator-pagespeed-ngx/archive/v${NPS_VERSION}-stable.zip
unzip v${NPS_VERSION}-stable.zip
cd incubator-pagespeed-ngx-${NPS_VERSION}-stable

# 下载 PSOL(PageSpeed Optimization Libraries)
PSOL_URL=$(scripts/format_binary_url.sh PSOL_BINARY_URL)
wget $PSOL_URL
tar xzf *.tar.gz

1.3 编译 Nginx

cd /usr/src

# 获取当前 Nginx 版本
NGINX_VER=$(nginx -v 2>&1 | grep -oP '\d+\.\d+\.\d+')
wget http://nginx.org/download/nginx-${NGINX_VER}.tar.gz
tar xzf nginx-${NGINX_VER}.tar.gz
cd nginx-${NGINX_VER}

# 获取当前编译参数并添加 PageSpeed 模块
./configure $(nginx -V 2>&1 | grep 'configure arguments' | sed 's/configure arguments: //') \
  --add-dynamic-module=/usr/src/incubator-pagespeed-ngx-${NPS_VERSION}-stable

make -j$(nproc)

# 安装模块
cp objs/ngx_pagespeed.so /etc/nginx/modules/

二、基础配置

# 在 nginx.conf 顶部加载模块
# load_module modules/ngx_pagespeed.so;

# 在 server 块中启用 PageSpeed
cat > /etc/nginx/conf.d/pagespeed.conf <<'EOF'
pagespeed on;

# 缓存目录
pagespeed FileCachePath /var/cache/ngx_pagespeed;
pagespeed FileCacheSizeKb 102400;
pagespeed FileCacheCleanIntervalMs 3600000;
pagespeed FileCacheInodeLimit 500000;

# 启用 CoreFilters(推荐的默认优化集)
pagespeed RewriteLevel CoreFilters;

# PageSpeed 管理路径
pagespeed StatisticsPath /ngx_pagespeed_statistics;
pagespeed GlobalStatisticsPath /ngx_pagespeed_global_statistics;
pagespeed MessagesPath /ngx_pagespeed_message;
pagespeed ConsolePath /pagespeed_console;
pagespeed AdminPath /pagespeed_admin;
pagespeed GlobalAdminPath /pagespeed_global_admin;

# 限制管理页面访问
location /ngx_pagespeed_statistics { deny all; }
location /ngx_pagespeed_global_statistics { deny all; }
location /pagespeed_admin { deny all; }
EOF

# 创建缓存目录
mkdir -p /var/cache/ngx_pagespeed
chown www-data:www-data /var/cache/ngx_pagespeed

nginx -t
systemctl reload nginx

三、过滤器详解

3.1 CoreFilters 包含的优化

  • add_head:确保 HTML 有 head 标签。
  • combine_css:合并多个 CSS 文件。
  • combine_javascript:合并多个 JS 文件。
  • convert_meta_tags:转换 meta 标签为 HTTP 头。
  • extend_cache:延长资源缓存时间。
  • inline_css:内联小型 CSS 文件。
  • inline_import_to_link:将 CSS @import 转换为 link。
  • inline_javascript:内联小型 JS 文件。
  • rewrite_css:压缩 CSS。
  • rewrite_javascript:压缩 JS。
  • rewrite_images:优化图片。

3.2 额外推荐过滤器

# 启用额外过滤器
pagespeed EnableFilters collapse_whitespace;
pagespeed EnableFilters lazyload_images;
pagespeed EnableFilters defer_javascript;
pagespeed EnableFilters prioritize_critical_css;
pagespeed EnableFilters convert_jpeg_to_webp;
pagespeed EnableFilters convert_png_to_jpeg;
pagespeed EnableFilters insert_dns_prefetch;
pagespeed EnableFilters move_css_to_head;

3.3 禁用特定过滤器

# 如果某个过滤器导致问题
pagespeed DisableFilters combine_javascript;
pagespeed DisableFilters rewrite_images;

四、图片优化配置

# 自动转换图片为 WebP
pagespeed EnableFilters convert_jpeg_to_webp;
pagespeed EnableFilters convert_png_to_jpeg;
pagespeed EnableFilters recompress_jpeg;
pagespeed EnableFilters recompress_png;
pagespeed EnableFilters resize_images;

# 图片质量设置
pagespeed JpegRecompressionQuality 80;
pagespeed WebpRecompressionQuality 80;
pagespeed ImageInlineMaxBytes 2048;
pagespeed CssImageInlineMaxBytes 2048;

# 启用图片延迟加载
pagespeed EnableFilters lazyload_images;
pagespeed LazyloadImagesBlankUrl "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";

五、缓存管理

# 清除 PageSpeed 缓存
touch /var/cache/ngx_pagespeed/cache.flush

# 或通过 Admin 页面清除(需要配置访问权限)
# 访问 /pagespeed_admin/cache?purge=*

# 禁用特定 URL 的 PageSpeed
location /admin/ {
    pagespeed off;
}

# 禁用特定文件类型
pagespeed Disallow "*.min.js";
pagespeed Disallow "*.min.css";

六、性能验证

# 检查响应头中的 PageSpeed 标识
curl -I http://your-domain.com/ | grep X-Page-Speed

# 查看优化后的 HTML 源码
curl -s http://your-domain.com/ | head -50

# 使用 PageSpeed Insights 在线测试
# https://pagespeed.web.dev/

# 使用 Lighthouse 本地测试
npm install -g lighthouse
lighthouse https://your-domain.com --output html --output-path report.html

七、注意事项

  • PageSpeed 模块会增加 CPU 和内存的开销,搬瓦工至少 1GB 内存的方案更适合使用。
  • 首次访问页面时速度可能变慢(需要生成优化后的资源),后续访问会命中缓存。
  • JavaScript 合并和延迟加载可能与某些前端框架冲突,需要逐个测试。
  • 建议在开发环境充分测试后再应用到生产环境。

总结

PageSpeed 模块可以自动完成大部分 Web 性能优化工作,是懒人优化的利器。对于更精细的控制,可以结合 Brotli 压缩WebP 图片优化Varnish 缓存 手动配置。选购搬瓦工 VPS 请查看 全部方案,购买时使用优惠码 NODESEEK2026 可享受 6.77% 的折扣,通过 bwh81.net 访问官网。

关于本站

搬瓦工VPS中文网(bwgvps.com)是非官方中文信息站,整理搬瓦工的方案、优惠和教程。我们不销售主机,不提供技术服务。

新手必读
搬瓦工优惠码

NODESEEK2026(优惠 6.77%)

购买时填入即可抵扣。