Brotli is a new compression algorithm developed by Google. Under the right circumstances, it manages to produce significantly smaller files than gzip can. Although gzip is currently the standard for web compression, brotli is a good candidate to take over this role, seeing widespread adoption in most modern browsers over the last couple of years.
In this post we will explore the characteristics of brotli and determine which consequences it has for its usage.
New trade-off
Both gzip and brotli come with a quality setting, which determines how much effort should be put into compressing files as efficiently as possible. Higher quality settings will produce smaller files, but it will take more time and CPU to produce those smaller files. Gzip allows quality settings from 1 to 9, brotli adds levels 10 and 11 to the options.
With gzip it is common to see the first couple of levels give increasingly better results, but at level 5/6 the improvements slow down or stop completely. Depending on the contents of the file you're compressing, the compressed file size at level 9 will probably be at most 1% smaller than the file size at level 6. Because of this, it is standard to pick a gzip quality setting of 5 or 6 for most use cases.
Brotli's quality setting behaves differently compared to gzip. Even at high quality levels brotli still shows significant improvements to the compressed file size. That comes at a cost though, with significantly larger compress times compared to gzip. In this experiment the compression speed of brotli at level 10 is about 100 times slower than gzip at level 6.
This characteristic of brotli means that there are now more complex compression strategies that can improve client side performance, bandwidth usage and/or (CDN) CPU usage.
Static content
For static content, like Javascript assets or statically generated HTML, higher levels of brotli compression can be very beneficial. Let's cover two ways in which you can serve static content with higher compression levels.
You can pre-compress your files, meaning you can compress them at the origin that your CDN or proxy gets them from. Time and CPU compressing files is completely spent during deployment, so no client will notice if you use the highest level of brotli (level 11). Not all browsers support brotli yet. Depending on your CDN/proxy, it can be difficult to setup a fallback to gzip for browsers that don't support brotli.
You can also choose to compress files on-the-fly, and then cache the compressed result. This way you can let your CDN/proxy handle compressing to a format that the client's browser supports. Depending on how long you cache your files, the cache hit rate and how big the files are, it can make sense to use brotli compression levels between 4 and 9. Levels 10 and 11 would produce smaller results, but because they are more than 10 times slower than level 9, there are few situations in which it makes sense to on-the-fly compress using brotli levels 10 and 11.
Dynamic content
Currently it is common to use gzip level 6 for dynamic content, as this offers a good trade-off between time spent compressing for every request and improved transfer size. When given small files, brotli can compress up to 30% more efficient than gzip but at the cost of being about 2-3 times slower. For dynamic content, that means that there is not much to gain using brotli for small files. However, for large dynamic content (bigger than 64kb), brotli offers three levels that can beat the results of gzip in multiple ways.
| Brotli level | Size (vs. gzip 6) | Time (vs. gzip 6) |
|---|---|---|
| 3 | 1% bigger | 42% faster |
| 4 | 1% smaller | 2% faster |
| 5 | 6% smaller | 43% slower |
- Level 3: If you care about reducing compression time, brotli level 3 provides 1% bigger but 42% faster compression compared to gzip level 6.
- Level 4: If you want to improve transfer size, brotli level 4 produces files that are smaller or similar to gzip level 9, and slightly faster than gzip level 6.
- Level 5: If you can live with longer compression times (for example because you are transferring really big files), brotli 5 produces results 6% smaller but 43% slower than gzip level 6.
For dynamic content, you are likely to want to choose from one of these levels to replace gzip compression for big files. Brotli level 4 seems like a good drop-in replacement for gzip level 6 with some percentage smaller files as a result.
Trying it out
A nice tool that I found to try brotli out is this gzip and brotli compression level estimator. You can give it any URL and it will compress that file at all the different possible configurations and give you a table to compare the results with. Go ahead and give it a try!
Top comments (0)