Compiling Nginx with Ngx_pagespeed On Ubuntu 14.04

In this tutorial, I’m going to show you how to compile Nginx mainline branch, version 1.9.9 at the time of this writing, with ngx_pagespeed module on Ubuntu 14.04 trusty. As of version 1.9.5, Nginx supports http2. So in order to enable http2 for Nginx, you have to install a version that is greater than 1.9.5.

1. Backup Your Nginx Configuration Files

Before we start, it is very important to back up your main nginx config file /etc/nginx/nignx.conf and server block files /etc/nginx/sites-available/*.conf or /etc/nginx/conf.d/*.conf.

2. Add Nginx official repository

First install PGP key from Nginx team.

wget http://nginx.org/keys/nginx_signing.key
sudo apt-key add nginx_signing.key

Edit /etc/apt/sources.list file.

sudo nano /etc/apt/sources.list

Add the following two lines at the end of the file.

deb http://nginx.org/packages/mainline/ubuntu/ trusty nginx
deb-src http://nginx.org/packages/mainline/ubuntu/ trusty nginx

Save and close the file. Then update local package index.

sudo apt-get update

3. Download Nginx Source Package

Make a directory in your home folder to store Nginx source package, then cd to the new directory:

mkdir ~/nginx && cd ~/nginx

Download Nginx source package with the below command

sudo apt-get source nginx

Output

Reading package lists... Done
Building dependency tree 
Reading state information... Done
Need to get 897 kB of source archives.
Get:1 http://nginx.org/packages/mainline/ubuntu/ trusty/nginx nginx 1.9.9-1~trusty (dsc) [1,415 B]
Get:2 http://nginx.org/packages/mainline/ubuntu/ trusty/nginx nginx 1.9.9-1~trusty (tar) [888 kB]
Get:3 http://nginx.org/packages/mainline/ubuntu/ trusty/nginx nginx 1.9.9-1~trusty (diff) [7,455 B]
Fetched 897 kB in 1s (459 kB/s) 
dpkg-source: info: extracting nginx in nginx-1.9.9
dpkg-source: info: unpacking nginx_1.9.9.orig.tar.gz
dpkg-source: info: unpacking nginx_1.9.9-1~trusty.debian.tar.gz

Now check the contents under ~/nginx directory.

[email protected]:~/nginx$ ls ~/nginx/
nginx-1.9.9    nginx_1.9.9-1~trusty.debian.tar.gz    nginx_1.9.9-1~trusty.dsc    nginx_1.9.9.orig.tar.gz

4. Download ngx_pagespeed Source Package

Go to Github ngx_pagespeed download page. ( https://github.com/pagespeed/ngx_pagespeed/releases ) Download the latest beta release to your home directory. v1.9.32.10-beta at the time of this writting. You may need to change the version number.

cd ~
wget https://codeload.github.com/pagespeed/ngx_pagespeed/zip/v1.9.32.10-beta

unzip it:

sudo apt-get install unzip
unzip v1.9.32.10-beta

cd to the newly-created directory:

cd ngx_pagespeed-1.9.32.10-beta/

Download PageSpeed Optimization Libraries (psol) and extract it.

wget https://dl.google.com/dl/page-speed/psol/1.9.32.10.tar.gz
tar xvf 1.9.32.10.tar.gz

It will create a psol directory under ngx_pagespeed-1.9.32.10-beta directory.

5. Add ngx_pagespeed Module to Nginx Compilation Rules

Edit Nginx compilation rule file.

sudo vi ~/nginx/nginx-1.9.9/debian/rules

In this file you will see two configuration block override_dh_auto_build and configure_debug. In override_dh_auto_build, add the following line at the end.

--add-module=/home/<username>/ngx_pagespeed-1.9.32.10-beta

Please note that you need to append a backslash at the –with-ipv6 line, or –add-module will be ignored.

# some text left out.
          --with-file-aio \
         $(WITH_HTTP2) \
          --with-cc-opt="$(CFLAGS)" \
         --with-ld-opt="$(LDFLAGS)" \
         --with-ipv6 \
         --add-module=/home/<username>/ngx_pagespeed-1.9.32.10-beta
 dh_auto_build
configure_debug:
     CFLAGS="" ./configure \
          --prefix=/etc/nginx \
         --sbin-path=/usr/sbin/nginx \
         --conf-path=/etc/nginx/nginx.conf \
# some text left out.

Save and close the file.

6. Compile and Install Nginx with ngx_pagespeed

cd to the nginx source directory.

cd ~/nginx/nginx-1.9.9/

Install all the dependancies that is needed to build Nginx:

sudo apt-get build-dep nginx

Use the following command to build a deb package.

sudo dpkg-buildpackage -b

Wait a few minutes. My server completed the task around two minutes. When it’s done, there will be two deb file in ~/nginx/ directory. The first is the one that we will install to Ubuntu server. The second is a debug version.

[email protected]: ls ~/nginx/*.deb
/home/user/nginx/nginx_1.9.9-1~trusty_amd64.deb /home/user/nginx/nginx-dbg_1.9.9-1~trusty_amd64.deb

If you have installed the nginx package before, remove it first.

sudo apt-get remove nginx nginx-common nginx-full nginx-core

Install the first deb package to your system.

sudo dpkg -i nginx_1.9.9-1~trusty_amd64.deb

After it’s installed, check the config arguments of Nginx

sudo nginx -V

If you see the following line at the end then ngx_pagespeed module is successfully added to Nginx.

--add-module=/home/<username>/ngx_pagespeed-1.9.32.10-beta

7. Enable ngx_pagespeed Module

pagespeed is installed along with Nginx, but it’s disabled by default. Before enable it, I recommend you to test your website speed at pingdom.com or webpagetest.org. After it’s enabled, do a test again so as to compare the two results.

Create a folder for pagespeed caches and change its ownership to Nginx user.

sudo mkdir -p /var/ngx_pagespeed_cache

sudo chown -R nginx:nginx /var/ngx_pagespeed_cache

Now open Nginx main config file /etc/nginx/nginx.conf

sudo vi /etc/nginx/nginx.conf

Add the following two lines in http block

pagespeed on;
pagespeed FileCachePath /var/ngx_pagespeed_cache;

Save and close the file. Then edit your server block file.

sudo vi /etc/nginx/conf.d/yourdomain.com.conf

Add the following lines to the server block.

location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" { add_header "" ""; }
location ~ "^/ngx_pagespeed_static/" { }
location ~ "^/ngx_pagespeed_beacon" { }

Save and close the file. Reload Nginx configuration.

sudo service nginx reload

8. Check if ngx_pagespeed is Working

Go to your website. Refresh a few times then check your page source. Hit Ctrl+F key and search pagespeed. You will see that many of your website resource has been processed by pagespeed. Some css files and javascript files are combined into one file. If you use Google Chrome browser, you will see that the picture of your website is in webp file format. webp can greatly reduce image file size.

You can also find ngx_pagespeed is working by comparing your website speed test.

Also on you server you can issue the following command:

curl -I -p http://localhost| grep X-Page-Speed

You will see X-Page-Speed and it’s version number.

X-Page-Speed: 1.9.32.10-7423

9. Hold Nginx from Being Upgraded

If a newer version of Nginx is available in the repository, the apt-get upgrade command will upgrade Nginx by default and you ngx_pagespeed module will be gone. So we need to prevent Nginx from being upgraded. This can be achieved by the following command: