How To Install Brotli Module for Nginx on Ubuntu 20.04

Introduction

Brotli ( br for short), is an open source compression algorithm developed by Google that can be used as an alternative to Gzip, Zopfli and Deflate. In some studies, data can be compressed by 10 to 20 percent more than current compression algorithms.

If you want to use Brotli with Nginx, you’ll have to use the ngx_brotli module developed by Google, since Nginx doesn’t have an official support, at least for its free version.

Prerequisites

Before installing  you should already have install Ubuntu on your instance and have install Nginx running as your web server with HTTPS.

Build Brotli module with Nginx

Brotli for nginx is represented by two dynamic modules. One for static files and second for dynamic content. We must manually compile them for use. Unfortunalety, we need to compile nginx to solve this problem. We will have to download the version of the mainline Nginx source code and extract it corresponding to the Nginx version that we have install on our instance.

Check the Nginx version with the following code.

sudo nginx -v

You should get the following output:

nginx version: nginx/1.18.0 (Ubuntu)

After that, download Nginx version that matches the current installed version. For our example our version is 1.18.0. Then extract it using the commands below for your version of Nginx:

cd ~/
wget https://nginx.org/download/nginx-1.18.0.tar.gz && tar zxvf nginx-1.18.0.tar.gz

NOTE: It is very important that version numbers of the Nginx package and Nginx source code match. If you installed Nginx 1.18.0 from the official Nginx repository, then you must download the same version of the source code, 1.18.0 in this case.

After extracting it, go and clone ngx_brotli module from Github using the commands below:

git clone https://github.com/eustas/ngx_brotli.git
cd ngx_brotli && git submodule update --init && cd ~

Navigate to the Nginx source code directory.

cd ~/nginx-1.18.0

Download and installed required libraries by running the commands below:

sudo apt install -y libpcre3 libpcre3-dev zlib1g zlib1g-dev openssl libssl-dev

After that, compile the ngx_brotli as a dynamic module by running the commands below.

./configure --with-compat --add-dynamic-module=../ngx_brotli
make modules
sudo mkdir /etc/nginx/modules
sudo cp objs/*.so /etc/nginx/modules

Copy modules to the /usr/share/nginx/modules/ directory.

sudo cp objs/ngx_http_brotli_filter_module.so /usr/share/nginx/modules/
sudo cp objs/ngx_http_brotli_static_module.so /usr/share/nginx/modules/

sudo chmod 644 /usr/share/nginx/modules/ngx_http_brotli_filter_module.so
sudo chmod 644 /usr/share/nginx/modules/ngx_http_brotli_static_module.so
sudo chmod 644 /etc/nginx/modules/*.so

Configure Nginx

At this point, we’re ready to load ngx_brotli module. Open your default nginx.conf file and load up the two modules you just compiled.

sudo nano /etc/nginx/nginx.conf

Then add the following two directives at the top of the file to load new Brotli modules.
load_module modules/ngx_http_brotli_filter_module.so;
load_module modules/ngx_http_brotli_static_module.so;

load_module modules/ngx_http_brotli_filter_module.so;
load_module modules/ngx_http_brotli_static_module.so;
user www-data;
worker_processes auto;
pid /run/nginx.pid;
include /etc/nginx/modules-enabled/*.conf;

events {
        worker_connections 768;
        # multi_accept on;
}

http {
...

Save and close using the CTRL + X combination, then press Y and confirm by pressing ENTER.

Next, test to make sure that there are no syntax errors in any of your Nginx files:

sudo nginx -t

If no problems were found, restart Nginx to enable your changes:

sudo systemctl restart nginx

Now we are going to enable Brotli for static and dynamic files by adding few lines to the /etc/nginx/nginx.conf file

sudo nano /etc/nginx/nginx.conf

We are going to past the following code after http {:

brotli on;
  brotli_static on;
  brotli_comp_level 6;
  brotli_types  text/css
		text/plain
		text/xml
		text/x-component
		text/javascript
		application/x-javascript
		application/javascript
		application/json
		application/manifest+json
		application/vnd.api+json
		application/xml
		application/xhtml+xml
		application/rss+xml
		application/atom+xml
		application/vnd.ms-fontobject
		application/x-font-ttf
		application/x-font-opentype
		application/x-font-truetype
		image/svg+xml
		image/x-icon
		image/vnd.microsoft.icon
		font/woff2
		font/ttf
		font/eot
		font/otf
		font/opentype;

http {
  brotli on;
  brotli_static on;
  brotli_comp_level 6;
  brotli_types text/css
               text/plain
	       text/xml
	       text/x-component
	       text/javascript
	       application/x-javascript
	       application/javascript
	       application/json
	       application/manifest+json
	       application/vnd.api+json
	       application/xml
	       application/xhtml+xml
	       application/rss+xml
	       application/atom+xml
	       application/vnd.ms-fontobject
	       application/x-font-ttf
	       application/x-font-opentype
	       application/x-font-truetype
	       image/svg+xml
	       image/x-icon
	       image/vnd.microsoft.icon
	       font/woff2
	       font/ttf
	       font/eot
	       font/otf
	       font/opentype;
...

Next, test to make sure that there are no syntax errors in any of your Nginx files:

sudo nginx -t

If no problems were found, restart Nginx to enable your changes:

sudo systemctl restart nginx

That’s all, at this time ngx_brotli should be installed and working properly on Ubuntu Linux. We’ve used a default brotli configuration that includes a good balance between compression level and accepted mime types.

Check ngx_brotli is working

The best way to check if ngx_brotli is working is by using this website tool at GiftOfSpeed.com.

That should do it!