How To Add Nginx Pagespeed aka ngx_pagespeed to Nginx on Ubuntu

Introduction

ngx_pagespeed, or just pagespeed, is an Nginx module designed to optimize your site
automatically by reducing the size of its resources and hence the time the clients' browsers
need to load it. If you are not acquainted with it already, please check its official site.

This article will guide you through the installation and configuration of the pagespeed module
 for Nginx. It's important to know that Nginx does not support Dynamic Loading of Modules
available in other web servers such as Apache. Since Nginx doesn't support this feature,
you need to build Nginx from source  to add the module.

Prerequisites

Before following this tutorial, please make sure you complete the following prerequisites:

• A Ubuntu Server 
• Nginx installed on it

Step 1 — Install Nginx

Before anything else, we are going to install Nginx:

sudo apt-get install nginx

Step 2 — Download the Source and Its Dependencies

Ubuntu or Debian

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

Build instructions

First download ngx_pagespeed:

#[check the release notes for the latest version]
NPS_VERSION=1.12.34.2-stable
cd
wget https://github.com/pagespeed/ngx_pagespeed/archive/v${NPS_VERSION}.zip
unzip v${NPS_VERSION}.zip
cd ngx_pagespeed-${NPS_VERSION}/
NPS_RELEASE_NUMBER=${NPS_VERSION/beta/}
NPS_RELEASE_NUMBER=${NPS_VERSION/stable/}
psol_url=https://dl.google.com/dl/page-speed/psol/${NPS_RELEASE_NUMBER}.tar.gz
[ -e scripts/format_binary_url.sh ] && psol_url=$(scripts/format_binary_url.sh PSOL_BINARY_URL)
wget ${psol_url}
tar -xzvf $(basename ${psol_url})  # extracts to psol/

Now we'll build Nginx with the pagespeed module (note the configure arguments are different from the version provided by upstream):

Download and build nginx with support for pagespeed:

NGINX_VERSION=[check nginx's site for the latest version] or check the version 
you installed by 

nginx -v 

cd
wget http://nginx.org/download/nginx-${NGINX_VERSION}.tar.gz
tar -xvzf nginx-${NGINX_VERSION}.tar.gz
cd nginx-${NGINX_VERSION}/
./configure --add-module=$HOME/ngx_pagespeed-${NPS_VERSION} ${PS_NGX_EXTRA_FLAGS}
make
sudo make install

To configure Nginx with all the default modules :

./configure --with-cc-opt='-g -O2 -fPIE -fstack-protector-strong -Wformat -Werror=format-security -Wdate-time -D_FORTIFY_SOURCE=2' --with-ld-opt='-Wl,-Bsymbolic-functions -fPIE -pie -Wl,-z,relro -Wl,-z,now' --prefix=/usr/share/nginx --conf-path=/etc/nginx/nginx.conf --http-log-path=/var/log/nginx/access.log --error-log-path=/var/log/nginx/error.log --lock-path=/var/lock/nginx.lock --pid-path=/run/nginx.pid --http-client-body-temp-path=/var/lib/nginx/body --http-fastcgi-temp-path=/var/lib/nginx/fastcgi --http-proxy-temp-path=/var/lib/nginx/proxy --http-scgi-temp-path=/var/lib/nginx/scgi --http-uwsgi-temp-path=/var/lib/nginx/uwsgi --with-debug --with-pcre-jit --with-http_ssl_module --with-http_stub_status_module --with-http_realip_module --with-http_auth_request_module --with-http_addition_module --with-http_dav_module --with-http_geoip_module --with-http_gunzip_module --with-http_gzip_static_module --with-http_image_filter_module --with-http_v2_module --with-http_sub_module --with-http_xslt_module --with-stream --with-stream_ssl_module --with-mail --with-mail_ssl_module --with-threads --add-module=$HOME/ngx_pagespeed-${NPS_VERSION}

Change the home variable and the NPS_Version with the version you downloaded

Step 3 — Enable the Pagespeed Module

You now have Nginx installed. The next step is to enable the ngx_pagespeed module.

Before enabling the module, you have to create a folder, where it will cache the files 

for your website:

sudo mkdir -p /var/ngx_pagespeed_cache

Make sure to change the ownership of this folder to the Nginx user so that the web server can store files in it:

sudo chown -R www-data:www-data /var/ngx_pagespeed_cache

Then, open the main Nginx configuration file nginx.conf in your favorite text editor like this:

sudo vim /etc/nginx/nginx.conf

In this file add the following lines to the http block and save the changes:

##
# Pagespeed Settings
##

pagespeed on;
pagespeed FileCachePath /var/ngx_pagespeed_cache;

You can add these lines anywhere in the http block, but in our example, I am adding it to the end of the block.

Also, you need to add pagespeed configuration lines to every server block file located in /etc/nginx/sites-available. For example, edit the /etc/nginx/sites-available/default file:

#  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 ~ "^/ngx_pagespeed_static/" { }
location ~ "^/ngx_pagespeed_beacon" { }

The above pagespeed configuration lines ensure that pagespeed will optimize every site's resources.

Finally, restart Nginx server for the changes to take effect:

sudo service nginx restart

Step 4 — Test the Installation

To check if ngx_pagespeed module has been installed successfully, run the Nginx binary like this:

sudo  nginx  -V

If the installation was successful, you should see the ngx_pagespeed module listed among the other modules:

--add-module=/home/ubuntu/ngx_pagespeed-1.12.34.2-stable 

The above doesn't mean yet that the pagespeed is enabled and works for your site. To confirm this you can use curl, a tool and a library for client-side URL transfers. If you don't have curl already installed, then install it with the command:

sudo apt-get install curl

After that check for the X-Page-Speed header like this:

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

If the ngx_pagespeed module works fine, you should see it in the output along with its version

X-Page-Speed: 1.9.32 

If you don't see this header, make sure that you have enabled pagespeed as per the instructions from the previous step.

Conclusion

That's how you can build Nginx with a custom module, pagespeed. These steps are valid for any other module that is not already available in Nginx.