Brotli Compression on Websites As a WPO Technique

February 26, 2024
8
Views

Brotli is a compression library based on the LZ77 compression and decompression algorithm , just like GZIP .

Although Brotli was initially created for compression of font files , it has come to represent a strong improvement or alternative to GZIP compression .

Remember that by using GZIP or Brotli we will make the web server compress the text files (HTML, CSS, JS, etc.) of the website before sending them to the visitor’s browser. With this we will save bandwidth and download time.

Unlike GZIP, Brotli does not use Deflate, and this improves the compression rate for text files (HTML, CSS, JS, etc.) by around 20%-30%.

Compression and decompression times are the same in theory, but in practice, things can vary a lot depending on the compression level set.

Today, most web browsers already support Brotli: Firefox implemented it in version 44, and all Chromium-based browsers implemented it starting with Chromium version 49.

Although Brotli compression may seem like a clear improvement over GZIP compression, the truth is that its compression algorithm has its good points and also its bad points.

Brotli VS GZIP

As we have said before, both GZIP and Brotli are based on the LZ77 algorithm.

The difference is that Brotli compression does not use Deflate as a base, which makes it an algorithm with a much higher compression rate.

Brotli’s improvement percentage depends on who you ask, but you can test it yourself with this web service and your website: https://tools.paulcalvano.com/compression.php

If you don’t have Brotli and GZIP enabled on your website, it may only show you data from one of the two.

The difference is quite clear. For a 418 kB HTML file, we get the following maximum compressions:

  • With GZIP level 9 compression we get a 78.7 kB file.
  • With Brotli level 11 compression we get a 57.2 kB file.

Cool, isn’t it? Well no.

It’s not all as pretty as it seems. In theory, Brotli at level 11 compresses more, but it also consumes more resources when compressing and decompressing, as well as being slower.

If we want Brotli to be an alternative to GZIP as a compression algorithm, we must even the balance. We get it easily, as actually, Brotli is much more efficient than GZIP, but we need to adjust the compression level.

Same HTML as before: 418 kB uncompressed.

  • With GZIP compression at level 9, we get 78.7 kB.
  • With Brotli compression at level 3, we get 76.5 kB.

Do you see it? Same file size, but with compression level 3 Brotli is much faster to compress and decompress than GZIP and also consumes much fewer resources.

As you can see in the image above, the compression rate varies between 2% and 27%, although it totally depends on the website and the files that need to be compressed.

It is important to analyze this calmly, since both in GZIP and Brotli, the more we increase the level, the greater the consumption of resources and the time used to compress and decompress.

To give you an example: a Brotli compression level 5 improves the compression rate by around 20% and is more efficient than a GZIP level 9.

This image can guide you a bit better on compression and decompression times along with GZIP and Brotli levels:

As for the drawbacks… Well, the only feature that could be a drawback is that Brotli only works with HTTPS (SSL), while GZIP works with both HTTP and HTTPS.

Brotli compatibility with servers and browsers

As I said before, older browsers don’t support Brotli and neither do web servers.

If you want to see a complete summary of web browsers that support Brotli compression and their versions, you can find it here: https://caniuse.com/?search=brotli

s for the compatible web servers, things change.

At the end of 2021, it is difficult to find a hosting with Apache that is compatible. It is even difficult to find servers with Nginx that are compatible with Brotli, although it is easier.

For Brotli to work with Apache we need to have at least Apache 2.4 and mod_brotli installed and activated. For Nginx, Nginx is usually built with Brotli as of version 1.18.

However, LiteSpeed ​​Web Server (the one we use in hosting with cPanel at Raiola Networks ) has been fully compatible with Brotli for years and has it activated by default without the need to do anything.

Activate Brotli in Apache

As we have said, we must have at least Apache 2.4 with mod_brotli activated and there we can modify the .htaccess with the following code to activate Brotli.

After doing this, I recommend checking the headers or using a service to check them.

Activate Brotli on hosting with LiteSpeed

As I said, Brotli is enabled by default on any server running LiteSpeed ​​Web Server.

LiteSpeed ​​Web Server was the first web server software implemented by Brotli as they are usually the first to implement new features.

And, as I mentioned before, there is nothing to do: LiteSpeed ​​Web Server has Brotli enabled by default.

In shared hosting, WordPress hosting, and in any Raiola Networks hosting that uses cPanel you have LiteSpeed ​​Web Server with Brotli activated by default.

Activate Brotli on Cloudflare or any CDN

If LiteSpeed ​​Web Server was the first webserver to implement Brotli, CloudFlare was the first CDN.

Cloudflare people are also usually among the first to implement new features and in this case, they were not going to be less.

To use Brotli in CloudFlare we must activate it in the section that we see on the screen of the previous capture.

Actually, nowadays most CDN services are compatible with Brotli.

KeyCDN implemented it shortly after CloudFlare and CDN77 took a bit longer, but it is currently supported. Even Amazon CloudFront took almost 3 more years, but right now it supports Brotli.

Activate Brotli in WordPress

The activation of Brotli in WordPress does not depend on WordPress but on the used web server and its characteristics.

By this, I mean that when we use a plugin to activate Brotli, behind the scenes it usually modifies the .htaccess to activate the functionality, but if the webserver does not have it active it will not work.

A WordPress plugin may allow you to enable Brotli on Apache or LiteSpeed, as long as they have the functionality enabled. Instead, you can’t turn compression on in Nginx because that’s done in the config files.

If we have a current version of Nginx with Brotli, we need to add this to Nginx.conf to activate Brotli:

Obviously, we will have to restart the Nginx webserver to activate the functionality after modifying the Nginx. conf.

Check if Brotli is activated

There are different services to test if Brotli is active for your website, although some show more data.

Personally, the one I like the most because of the data it shows is this: https://tools.paulcalvano.com/compression.php

If you are looking for a much simpler tool, KeyCDN’s Brotli Test is ideal for you: https://tools.keycdn.com/brotli-test

Also, as in the case of GZIP compression, we can check the compression through the HTTP request headers:

Note that we can have GZIP and Brotli enabled at the same time and this will show up in the HTTP request headers.

Article Categories:
Digital
Sara https://techbrazzers.com/

Sarah Maynard is the author of Tech Brazzers. She is excited you are here — because you’re a lot alike, you and her. Tech Brazzers is a blog that’s dedicated to serving to folks find out about technology, business, lifestyle, and fun, and of course, we are not porno…lol

Comments are closed.