Reliably serve brotli compressed files with gzip fallback while ensuring no compression overhead when serving brotli files.
How much will it benefit your website performance?
Serving brotli compressed files helps reduce transfer size for HTML, CSS, JS and SVG files, but not JPG, PNG, WebP, GIFs. So, the over-all speed benefit will be reduction in download time for files of above mentioned types. The speed benefit depends on how much compression you achieve for your files. For top five pages on our website, www.tezify.com, we observed a 20-43% reduction in page’s total transfer size (total data downloaded for a page to display).
For top five pages on our website (www.tezify.com), brotli compression reduced the page’s total transfer size (total data downloaded to display a page) by 20% to 43%.
Generating brotli compressed files
Brotli compression can be CPU intensive. This means, compressing your files into brotli format through web server while serving a request is a bad idea. Instead, you should pre-compress and store brotli compressed files for your HTML, CSS, JS and SVG files. This should be done during build & deploy. You can use one of the following to brotli compress your files:
With any of the above, your goal should be to have brotli compressed files next to your regular files (style.css should have a corresponding style.css.br)
Serving brotli compressed files via Nginx
You can use Google’s Nginx module for Brotli to serve generated brotli files. Once installed, below is the recommended Nginx configuration (generally goes into /etc/nginx/nginx.conf):
If installing / adding ngx_brotli is problematic, you can add the following configuration within your server block to serve pre-compressed brotli files:
Serving brotli compressed files via Apache
Add the following within your <VirtualHost> within your apache configuration file (typically within /etc/apache2/sites-enabled/):
CDN specific changes to serve brotli files
If you are leveraging a CDN, chances are that despite the above configuration, brotli compressed files may not be served to your visitors. You may have to make additional changes depending on your CDN provider:
Verifying if your site is serving brotli files
To verify if your pages are served brotli compressed or no, run the following command for your website’s URL and look for the value within ‘Content-Encoding’ in the response header. If it is ‘br’ like in the screenshot below, your brotli compression setup is working as expected.
curl -H ‘Accept-Encoding: br’ -I <Enter Your URL Here>