NGINX is an awesome high-performance HTTP server and reverse proxy server. NGINX is one of the best performing web servers available due to it’s ability of Handling high concurrency with high performance and efficiency in mind. In this tutorial i will show you how to compile it from source so we can add Google’s PageSpeed module which the default Ubuntu NGINX lacks. The PageSpeed Module 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. Some of the features included in PageSpeed are:

  • 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

Connect to your server via SSH.

ssh [email protected]

Always update your package sources so that you always have the latest versions of the packages that you may need to download or install.

sudo apt-get update

Now we will download and install all of the dependencies that NGINX requires

sudo apt-get build-dep nginx

We will need to create a work directory to download our source files.

mkdir ~/nginx-pagespeed

Now we change to the newly created directory

cd ~/nginx-pagespeed

The following command will download the source files so we can build our NGINX

sudo apt-get source nginx

Next step is to go to the modules directory so we can get the PageSpeed module prior to compiling.

cd nginx-*/debian/modules

This command will download the latest version of the module

sudo wget https://github.com/pagespeed/ngx_pagespeed/archive/master.zip

Now we will unzip the master.zip file to extract the module. If you don’t have the unzip command available you can get it by running the following command.

sudo apt-get install unzip

Extract the files by running the following:

sudo unzip master.zip

Next we go to the PageSpeed module directory and download the dependencies for the PageSpeed module compilation.

cd ngx_pagespeed-master

Get PSOL libraries required by the PageSpeed module to compile.Depending on what version of the pagespeed module the following file may be different. To find out the correct version to download run this command :

cat config | grep 'wget'

You should see something like this, note the command in red:

echo " $ wget https://dl.google.com/dl/page-speed/psol/1.11.33.3.tar.gz"

Get the correct file using wget as sudo.

sudo wget https://dl.google.com/dl/page-speed/psol/1.11.33.3.tar.gz

Extract the files

sudo tar -xzvf 1.11.33.3.tar.gz

Let’s modify de NGINX compilation config file to include our PageSpeed Module

nano ~/nginx-pagespeed/nginx-*/debian/rules

Assuming we are going to install NGINX using the light configuration which installs the basic modules to NGINX, we will change the following from this:

config.status.light: config.env.light cd $(BUILDDIR_light) && ./configure \ $(common_configure_flags) \ --with-http_gzip_static_module \ --without-http_browser_module \ --without-http_geo_module \ --without-http_limit_req_module \ --without-http_limit_zone_module \ --without-http_memcached_module \ --without-http_referer_module \ --without-http_scgi_module \ --without-http_split_clients_module \ --without-http_ssi_module \ --without-http_userid_module \ --without-http_uwsgi_module \ --add-module=$(MODULESDIR)/nginx-echo \ >[email protected] touch [email protected]

To this:

config.status.light: config.env.light cd $(BUILDDIR_light) && ./configure \ $(common_configure_flags) \ --with-http_gzip_static_module \ --without-http_browser_module \ --without-http_geo_module \ --without-http_limit_req_module \ --without-http_limit_zone_module \ --without-http_memcached_module \ --without-http_referer_module \ --without-http_scgi_module \ --without-http_split_clients_module \ --without-http_ssi_module \ --without-http_userid_module \ --without-http_uwsgi_module \ --add-module=$(MODULESDIR)/nginx-echo \ --add-module=$(MODULESDIR)/ngx_pagespeed-master \ >[email protected] touch [email protected]

You could add the same line to any of the other build configurations if light is not what you intend to install.

Now we edit the changelog to provide a better name for our package so we can identify it.

sudo nano ~/nginx-pagespeed/nginx-*/debian/changelog

we can add the word pagespeed to distinguish the package. Should look like this afterwards depending on your version of NGINX

nginx (1.4.6-1ubuntu3.5-pagespeed) trusty-security; urgency=medium

Now we will go to the source directory and build the package

cd ~/nginx-pagespeed/nginx-*/

This will compile the package, this step might take some time so feel free to grab a cup of coffee.

sudo dpkg-buildpackage -b

Now that the package is built all we have to do is install it.

We go into the directory containing the deb packages

cd ~/nginx-pagespeed/

To Install we will run the following command

sudo dpkg -i nginx-common_*pagespeed_all.deb nginx-light_*pagespeed_amd64.deb

Now we enable the PageSpeed module

With this command we will create a directory for the NGINX module to cache files.

sudo mkdir -p /var/pagespeed-cache

Now we give it the correct permissions so the webserver can write to the cache directory.

sudo chown -R www-data:www-data /var/pagespeed-cache

Next step is to add the following lines in the NGINX config file

sudo nano /etc/nginx/nginx.conf

Make sure to add the lines inside the http block

pagespeed on;
pagespeed FileCachePath /var/pagespeed-cache;

It should look something like this:

...
http { ## # Basic Settings ## sendfile on; tcp_nopush on; tcp_nodelay on; keepalive_timeout 65; types_hash_max_size 2048; server_tokens off; # server_names_hash_bucket_size 64; # server_name_in_redirect off; include /etc/nginx/mime.types; default_type application/octet-stream;  ## # PageSpeed Settings ## pagespeed on; pagespeed FileCachePath /var/pagespeed-cache;

...

Now we need to add rules in the server in your default config.

sudo nano /etc/nginx/sites-available/default

Add the following lines at the end of your server block like this:

server { listen 80; listen [::]:80; root /usr/share/nginx/html; index index.html index.htm; server_name localhost; location / { }
 location ~ "\.pagespeed\.([a-z]\.)?[a-z]{2}\.[^.]{10}\.[^.]+" { add_header "" ""; } location ~ "^/pagespeed_static/" { } location ~ "^/ngx_pagespeed_beacon$" { }

}

Additionally you can add these lines to your server to config to enable some of the PageSpeed filters, note that they are all commented out, you can enable the ones that you need by removing the comment tag #

# HTTPS Support
# pagespeed FetchHttps enable;

# PageSpeed Filters
# CSS Minification
# pagespeed EnableFilters combine_css,rewrite_css;

# JS Minification
# pagespeed EnableFilters combine_javascript,rewrite_javascript;

# Images Optimization
#pagespeed EnableFilters lazyload_images;
#pagespeed EnableFilters rewrite_images;
#pagespeed EnableFilters convert_jpeg_to_progressive,convert_png_to_jpeg,convert_jpeg_to_webp,convert_to_webp_lossless;

# Remove comments from HTML 
#pagespeed EnableFilters remove_comments; 
# Remove WHITESPACE from HTML 
#pagespeed EnableFilters collapse_whitespace;

# CDN Support
#pagespeed MapRewriteDomain cdn.example.com www.example.com;

For a full list of filters go here That’s it.

Now we restart the service and we should have a functioning NGINX server with the PageSpeed module enabled.

admin