How to Build Nginx with Google Pagespeed Support

time to read 3 min | 552 words

Nginx (engine-x) is an open source and high-performance HTTP server, reverse proxy and IMAP/POP3 proxy server. The outstanding features of Nginx are stability, a rich feature set, simple configuration and low memory consumption. This tutorial shows how to build a Nginx .deb package for Ubuntu 16.04 from source that has Google PageSpeed module compiled in.

PageSpeed is a web server module developed by Google to speed up the website response time, optimize the returned HTML and reduce the page load time. ngx_pagespeed features including:

  • 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.

see more https://developers.google.com/speed/pagespeed/module/.

Install the build dependencies

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

Installing nginx with ngx_pagespeed

Step 1 - Add the nginx repository

Create a new repository file /etc/apt/sources.list.d/nginx.list with you favourite editor.

nano /etc/apt/sources.list.d/nginx.list

There you add the lines: Save the file and exit the editor.

deb http://nginx.org/packages/ubuntu/ xenial nginx
deb-src http://nginx.org/packages/ubuntu/ xenial nginx

Add the key and update the repository:

sudo sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys ABF5BD827BD9BF62
sudo apt-get update

Step 2 - Download nginx 1.12 from ubuntu repository

Create a new directory for the nginx source files and download the nginx sources with apt:

cd ~
mkdir -p ~/compile/nginx_source/
cd ~/compile/nginx_source/
apt-get source nginx

Sometimes, there is an error: ‘packages cannot be authenticated’. You can solve it by typing command below:

rm -rf /var/lib/apt/lists/
apt-get update

Next, install all dependencies to build the nginx package.

apt-get build-dep nginx

Step 3 - Download Pagespeed

Create a new directory for PageSpeed and download the PageSpeed source. In this tutorial, we will use pagespeed 1.11.33.4 (latest stable one)

mkdir -p ~/compile/ngx_pagespeed/
cd ~/compile/ngx_pagespeed/
export ngx_version=1.11.33.4
wget https://github.com/pagespeed/ngx_pagespeed/archive/release-${ngx_version}.zip
unzip release-${ngx_version}.zip

cd ngx_pagespeed-release-${ngx_version}/
wget https://dl.google.com/dl/page-speed/psol/${ngx_version}.tar.gz
tar -xf ${ngx_version}.tar.gz

Step 4 - Configure nginx to build with Pagespeed

Go to the ‘nginx_source’ directory and edit the ‘rules’ file.

cd ~/compile/nginx_source/nginx-1.12.0-1/debian/
vim rules

Add this parameter under config.status.nginx and config.status.nginx_debug:

--add-module=~/compile/ngx_pagespeed/ngx_pagespeed-release-1.11.33.3-beta

Save and exit.

Step 5 - Build the nginx Ubuntu package and install it

Go to the nginx source directory and build nginx from source with the dpkg-buildpackage command:

cd ~/compile/nginx_source/nginx-1.12.0-1/
dpkg-buildpackage -b

The nginx Ubuntu package will be saved under ~/compile/nginx_source/. Once package building is complete, please look in the directory:

cd ~/compile/nginx_source/
ls

The Nginx Ubuntu package has been built. And install nginx and modules deb with dpkg command.

dpkg -i *.deb

Testing

Step 1 - Testing with the Nginx Command

Run nginx -V to check that the ngx_pagespeed module has been built into nginx.

Step 2 - Testing with Curl Command

Go to nginx configuration directory and edit default virtual host configuration file.

cd /etc/nginx/
nano nginx.conf

Paste configuration below to enable ngx_pagespeed.

pagespeed on;

# Needs to exist and be writable by nginx.  Use tmpfs for best performance.
pagespeed FileCachePath /var/ngx_pagespeed_cache;

# Ensure requests for pagespeed optimized resources go to the pagespeed handler
# and no extraneous headers get set.
location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" {
  add_header "" "";
}
location ~ "^/pagespeed_static/" { }
location ~ "^/ngx_pagespeed_beacon$" { }

Save and exit. Next, test the nginx configuration file and make sure there is no error:

nginx -t

Restart nginx:

systemctl restart nginx

Finally, access the nginx web server with the curl command:

curl -I your-ip-address