Blog

Blog

PHODAL

Nginx ngx_pagespeed nginx前端优化模块编译

偶然间在网上发现这样一个扩展,用于对前端页面而进行服务器端的优化。

Ngx_pagespeed 简介

关于Nginx Pagespeed

ngx_pagespeed speeds up your site and reduces page load time by automatically applying web performance best practices to pages and associated assets (CSS, JavaScript, images) without requiring you to modify your existing content or workflow. Features include:

  • Image optimization: stripping meta-data, dynamic resizing, recompression
  • CSS & JavaScript minification, concatenation, inlining, and outlining
  • Small resource inlining
  • Deferring image and JavaScript loading
  • HTML rewriting
  • Cache lifetime extension
  • and more

ngx_pagespeed 是 Nginx 的一个扩展模块,主要的功能是针对前端页面而进行服务器端的优化,对前端设计人员来说,可以省去优化css、js以及图片的过程。ngx_pagespeed对nginx自身负载能力的提升基本是看不到的,甚至会因为进行服务器端的优化而使系统增加负载;但从减少客户请求数的角度去看,牺牲部分服务器性能还是值得的。

主要功能包含:

  • 图像优化:剥离元数据、动态调整,重新压缩
  • CSS和JavaScript压缩、合并、级联、内联
  • 小资源内联
  • 推迟图像和JavaScript加载
  • 对HTML重写、压缩空格、去除注释等
  • 提升缓存周期
  • 以及其他config_filters

Ngx_pagespeed编译

默认的CentOS似乎包含了某些依赖。没有的话。。

一、 安装Ngx_pagespeed依赖

对于CentOS来说

 sudo yum install gcc-c++ pcre-dev pcre-devel zlib-devel make

pcre和必须的,如果没有装的话,你可能会在编译的时候遇到问题,参见下面的编译选项

Ubuntu的话应该是

  sudo apt-get install build-essential zlib1g-dev libpcre3 libpcre3-dev

二、编译Ngx_pagespeed

下载Ngx_pagespeed

一开始没按照官方写的文档,于是就报错了。

ngx_pagespeed: pagespeed optimization library not found:

 You need to separately download the pagespeed library:

 $ cd /path/to/ngx_pagespeed
 $ wget https://dl.google.com/dl/page-speed/psol/1.7.30.3.tar.gz
 $ tar -xzvf 1.7.30.3.tar.gz # expands to psol/

Or see the installation instructions: https://github.com/pagespeed/ngx_pagespeed#how-to-build

正确的步骤应该是


    $ cd ~
    $ wget https://github.com/pagespeed/ngx_pagespeed/archive/v1.7.30.4-beta.zip
    $ unzip v1.7.30.4-beta.zip # or unzip v1.7.30.4-beta
    $ cd ngx_pagespeed-1.7.30.4-beta/
    $ wget https://dl.google.com/dl/page-speed/psol/1.7.30.4.tar.gz
    $ tar -xzvf 1.7.30.4.tar.gz # expands to psol/

编译Nginx

官方的步骤如下:

$ cd ~
$ # check http://nginx.org/en/download.html for the latest version
$ wget http://nginx.org/download/nginx-1.6.0.tar.gz
$ tar -xvzf nginx-1.6.0.tar.gz
$ cd nginx-1.6.0/
$ ./configure --add-module=$HOME/ngx_pagespeed-1.7.30.4-beta
$ make
$ sudo make install

但是这个是我的步骤及编译选项

$ cd ~
$ wget http://nginx.org/download/nginx-1.7.0.tar.gz
$ tar -xvzf nginx-1.7.0.tar.gz
$ cd nginx-1.7.0/
$./configure --user=www --group=www --add-module=../nginx-static-etags --add-module=../ngx_pagespeed-1.7.30.4-beta --prefix=/usr/local/nginx --with-pcre --with-http_stub_status_module --with-http_ssl_module --with-http_gzip_static_module --with-ipv6
$ make
$ sudo make install

感觉似乎添加的选项比较多,然后我们可以用nginx -V来查看是否编译成功。

查看nginx详细配置

[root@CentOS62 conf]# nginx -V
nginx version: nginx/1.7.0
built by gcc 4.4.7 20120313 (Red Hat 4.4.7-3) (GCC)
TLS SNI support enabled
configure arguments: --user=www --group=www --add-module=../nginx-static-etags --add-module=../ngx_pagespeed-1.7.30.3-beta --prefix=/usr/local/nginx --with-pcre --with-http_stub_status_module --with-http_ssl_module --with-http_gzip_static_module --with-ipv6

查看是否编译成功

直接打开网站看js和css是否有类似于下面带有pagespeed之类的。

jquery.js,qver=1.11.0.pagespeed.jm.ocognCjcS2.js

关于我

Github: @phodal     微博:@phodal     知乎:@phodal    

微信公众号(Phodal)

围观我的Github Idea墙, 也许,你会遇到心仪的项目

QQ技术交流群: 321689806

我的书《自己动手设计物联网》开卖了

本书从自己动手打造一个物联网出发,旨在教会读者如何从系统级别、架构级别去设计物联网,从而掌握打造物联网系统的全过程。本书在讲解的过程中遵循循序渐进的思想。首先,设计一个基于文本文件的物联网系统,向读者展示一个基本的物联网体系。然后,实现以互联网为基础的物联网系统,即以HTTP协议与Web编程为基础的物联网系统。最后,打造一个能结合多个物联网协议的物联网系统。

在这个过程中,读者还将学会如何打造物联网的相关应用——手机APP、温度趋势、网页端控制等,以及如何打造智能、安全的物联网系统的相关内容。

comment

Feeds

RSS / Atom

最近文章

关于作者

Phodal Huang

Developer, Consultant, Writer, Designer

InfoQ社区编辑,CSDN前端博客专家

毕业于西安文理学院电子信息工程专业

长期活跃于开源软件社区 GitHub,专注于物联网和前端领域。

著有《自己动手设计物联网》(电子工业出版社)、曾作为技术专家审阅英国 Packt 出版社的物联网书籍《Learning IoT》、《Smart IoT》等书。

在 GitHub 开源有《Growth:全栈增长工程师指南》等六本电子书,并译有《物联网实战指南》。

联系我: h@phodal.com

标签

最近的一些事