Nginx is a free and open-source web server that powers many sites on the internet. It can be used as a reverse proxy and load balancer. It is known for its high-performance and stability.

ngx_pagespeed is an open-source Nginx module that can be used to optimize your website performance. It is developed by Google and reduces the page load time and speed up the website response time.

In this tutorial, we will show you how to compile ngx_pagespeed as a dynamic module with Nginx on Ubuntu 20.04 server.

Prerequisites

  • A server running Ubuntu 20.04.
  • A valid domain name pointed with your server IP. In this tutorial, we will use example.com domain.
  • A root password is configured the server.

Getting Started

Before starting, you will need to update your system packages to the latest version. You can update them by running the following command:

apt-get update -y

Once all the packages are installed, you will need to install some required dependencies to your system. You can install all of them with the following command:

apt-get install dpkg-dev build-essential zlib1g-dev libpcre3 git libpcre3-dev unzip -y

Once all the packages are installed, you can proceed to the next step.

Install Nginx Webserver

Next, you will need to install the Nginx web server to your system. You can install it with the following command:

apt-get install nginx -y

Once the installation is completed, you can verify the installed version of Nginx with the following command:

nginx -v

You should see the Nginx version in the following output:

nginx version: nginx/1.18.0 (Ubuntu)

Once you are finished, you can proceed to the next step.

Download and Compile ngx_pagespeed

Before downloading and compiling ngx_pagespeed. You will need to download the Nginx source in your system. You can downlaod the Nginx source package with the following command:

Note: Make sure downlaoded Nginx version will match the installed Nginx version. Here, installed version of Nginx is 1.18.0. So you will need to download Nginx source of version 1.18.0 from the Nginx website.

wget http://nginx.org/download/nginx-1.18.0.tar.gz

Once the download is completed, extract the downloaded file with the following command:

tar -xvzf nginx-1.18.0.tar.gz

Next, download the ngx_pagespeed source from the Git repository with the following command:

git clone https://github.com/apache/incubator-pagespeed-ngx.git

Once the download is completed, change the directory to the downloaded directory and check out the stable version with the following command:

cd incubator-pagespeed-ngx

git checkout latest-stable

You should get the following output:

Note: switching to 'latest-stable'.

You are in 'detached HEAD' state. You can look around, make experimental
changes and commit them, and you can discard any commits you make in this
state without impacting any branches by switching back to a branch.

If you want to create a new branch to retain commits you create, you may
do so (now or later) by using -c with the switch command. Example:

  git switch -c 

Or undo this operation with:

  git switch -

Turn off this advice by setting config variable advice.detachedHead to false

HEAD is now at 11ba8ea54 Update PSOL_BINARY_URL

From the above output, cat the “PSOL_BINARY_URL” file to see the PSOL download URL:

cat PSOL_BINARY_URL

You should get the following output:

https://dl.google.com/dl/page-speed/psol/1.13.35.2-$BIT_SIZE_NAME.tar.gz

Now, run the following command to download PSOL using the above URL:

wget https://dl.google.com/dl/page-speed/psol/1.13.35.2-x64.tar.gz

Next, extract the downloaded file with the following command:

tar -xvzf 1.13.35.2-x64.tar.gz

Next, change the directory to the Nginx source and install all required dependencies with the following command:

cd /root/nginx-1.18.0

apt-get build-dep nginx

apt-get install uuid-dev

Next, compile the ngx_pagespeed module with the following command:

./configure --with-compat --add-dynamic-module=/root/incubator-pagespeed-ngx

You should get the following output:

Configuration summary
    using system PCRE library
    OpenSSL library is not used
    using system zlib library

  nginx path prefix: "https://www.howtoforge.com/usr/local/nginx"
  nginx binary file: "https://www.howtoforge.com/usr/local/nginx/sbin/nginx"
  nginx modules path: "https://www.howtoforge.com/usr/local/nginx/modules"
  nginx configuration prefix: "https://www.howtoforge.com/usr/local/nginx/conf"
  nginx configuration file: "https://www.howtoforge.com/usr/local/nginx/conf/nginx.conf"
  nginx pid file: "https://www.howtoforge.com/usr/local/nginx/logs/nginx.pid"
  nginx error log file: "https://www.howtoforge.com/usr/local/nginx/logs/error.log"
  nginx http access log file: "https://www.howtoforge.com/usr/local/nginx/logs/access.log"
  nginx http client request body temporary files: "client_body_temp"
  nginx http proxy temporary files: "proxy_temp"
  nginx http fastcgi temporary files: "fastcgi_temp"
  nginx http uwsgi temporary files: "uwsgi_temp"
  nginx http scgi temporary files: "scgi_temp"

Next, run the following command to build the Pagespeed module:

make modules

Next, copy the generated module to the Nginx modules directory:Advertisement

cp objs/ngx_pagespeed.so /usr/share/nginx/modules/

At this point, ngx_pagespeed module is compiled in your system. You can now proceed to the next step.

Configure Nginx to Use ngx_pagespeed Module

Next, you will need to configure Nginx to use the ngx_pagespeed module. First, edit the Nginx main configuration file and define the ngx_pagespeed module path:

nano /etc/nginx/nginx.conf

Add the following line at the beginning of the file:

load_module modules/ngx_pagespeed.so;

Save and clsoe the file when you are finished.

Next, create a directory for pagespeed caches with the following command:

mkdir -p /var/ngx_pagespeed_cache

Set the proper ownership using the following command:

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

Next, edit the Nginx default virtual host configuration file and add the pagespeed configutation:

nano /etc/nginx/sites-available/default

Replaced all the lines with the following lines:

server {
     listen 80;
     server_name example.com; 

     root /var/www/html;
     index index.nginx-debian.html index.html index.htm;

     access_log   /var/log/nginx/access.log;
     error_log    /var/log/nginx/error.log;

     location / {
         try_files $uri $uri/ =404;
     }

     pagespeed on;
     pagespeed FileCachePath "https://www.howtoforge.com/var/ngx_pagespeed_cache/";
     pagespeed RewriteLevel OptimizeForBandwidth;

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

     location ~ "^/pagespeed_static/" { }
     location ~ "^/ngx_pagespeed_beacon$" { }
pagespeed RewriteLevel CoreFilters;

 }

Save and close the file when you are finished. Then, verify Nginx for any syntax error using the following command:

nginx -t

You should get the following output:

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

Finally, restart the Nginx service to apply the changes:

systemctl restart nginx

You can also verify the status of the Nginx service using the following command:

systemctl status nginx

You should get the following output:

? nginx.service - A high performance web server and a reverse proxy server
     Loaded: loaded (/lib/systemd/system/nginx.service; enabled; vendor preset: enabled)
     Active: active (running) since Thu 2020-11-26 05:32:23 UTC; 20s ago
       Docs: man:nginx(8)
    Process: 363 ExecStartPre=/usr/sbin/nginx -t -q -g daemon on; master_process on; (code=exited, status=0/SUCCESS)
    Process: 385 ExecStart=/usr/sbin/nginx -g daemon on; master_process on; (code=exited, status=0/SUCCESS)
   Main PID: 386 (nginx)
      Tasks: 3 (limit: 2353)
     Memory: 14.4M
     CGroup: /system.slice/nginx.service
             ??386 nginx: master process /usr/sbin/nginx -g daemon on; master_process on;
             ??387 nginx: worker process
             ??388 nginx: worker process

Nov 26 05:32:23 ubuntu2004 systemd[1]: Starting A high performance web server and a reverse proxy server...
Nov 26 05:32:23 ubuntu2004 systemd[1]: Started A high performance web server and a reverse proxy server.

Once you are finished, you can proceed to the next step.

Verify the ngx_pagespeed Module

At this point, Nginx is configured with ngx_pagespeed support. Now, its time to test it whether is it installed or not.

To test the pagespeed, run the following command by secifying your domain name:

curl -I -p http://example.com

If everything is fine, you should get the following output:

HTTP/1.1 200 OK
Server: nginx/1.18.0 (Ubuntu)
Content-Type: text/html
Connection: keep-alive
Vary: Accept-Encoding
Date: Wed, 25 Nov 2020 11:58:56 GMT
X-Page-Speed: 1.13.35.2-0
Cache-Control: max-age=0, no-cache

In the above output, X-Page-Speed: 1.13.35.2-0 means PageSpeed is active and optimizing your website.

Conclusion

Congratulations! you have successfully installed ngx_pagespeed with Nginx on Ubuntu 20.04 server. I hope this module will increase your Nginx web server performance and speed up the website. Feel free to ask me if you have any questions.