Both Chrome and Firefox have announced that they will be utilizing a new compression algorithm named Brotli. What is Brotli (hint: it’s not a vegetable), and how will it help with web performance? We’ll take a quick overview in this post.

Background

Developed by Jyrki Alakuijala and Zoltán Szabadka, Brotli was first released in 2013 for compression of web fonts (WOFF 2.0). Last year, Google released an updated version that had enhancements in generic lossless data compression, with an emphasis on HTTP compression. One big difference between Brotli and other general purpose compression algorithms is its use of a pre-defined 120 kibibyte dictionary or 13000 common words, phrases, and substrings.

What’s “Brotli” Even Mean?

Just like Zopfli, another compression algorithm from Google, Brotli gets its name from a Swiss baked good. In Swiss German, Brötli) means ‘small bread.’ Now you know.

Benefits of Brotli

Unlike the Zopfil algorithm, which was Deflate-compatible, Brotli is a whole new data format. This new format allows it to offer significant compression gains over previous algorithms—roughly 20-26% better than Zopfli, while still maintaining similar speeds.

Better compression would allow us to use fewer bytes to transfer the same assets over the wire. Which means faster load times and less data usage for our users.

Here’s an excerpt from Google’s announcement:

“The smaller compressed size allows for better space utilization and faster page loads. We hope that this format will be supported by major browsers in the near future, as the smaller compressed size would give additional benefits to mobile users, such as lower data transfer fees and reduced battery use.”

Some Stats

Generally speaking, the performance gains are as follows (source):

  • Outperforms gzip for typical web assets by 17-25%
  • HTML: 25% savings
  • JS (Alexa Top 10k): 17% savings
  • Minified JS (Alexa Top 10k): 17% savings
  • CSS (Alexa Top 10k): 17% savings

Next Steps

In order to take advantage of these savings, there are two components that need to be in place.

  1. The web server has to be set up to encode its assets using Brotli.
  2. The web browser requesting the assets needs to support the Brotli format. Currently, Chrome is scheduled to have Brotli support in version 49 (scheduled for beginning of March), and Firefox has already enabled support in version 44.

Most users have browsers that are updated automatically, so it should only be a matter of time before most browsers will be able to support this format. But for those of us who build sites, we’ll need to make sure our servers are configured to utilize Brotli in order for our visitors to experience the performance gains that it provides. This will be the topic of an upcoming post.

Brotli isn’t used widely yet. But with the benefits it provides, it’s easy to envision it gaining traction fairly quickly. And that’s something that all of us, especially those on mobile, can look forward to.