How we used the Brotli compression algorithm to improve our customer experience with faster loading times
Over the past few days, our team has been working on some player optimizations to reduce player file sizes and improve loading time. We have started using some new compression methods and technologies to improve our platform and speed up our player.
What Is Brotli Compression Algorithm and How It Works
Recently, Amazon has announced support for Brotli compression — a powerful compression algorithm that provides better results than Gzip, which we previously used.
Brotli is a compression algorithm developed by Google and initially released in 2013 for web fonts. Over a few years, it evolved into a powerful compression method most suitable for text compression.
Brotli encoder got partly rewritten in 2015 by Google engineers, which further improved its compression ratio. The engineers sped up its encoder and decoder, deducted the decoding memory, enhanced the streaming API, and added more compression levels as well. All these improvements resulted in better performance overall across platforms.
This compression algorithm uses a pre-defined dictionary (around 120kb in size) and a dynamically populated (sliding-window) dictionary. The pre-defined dictionary contains over 13,000 common words, phrases, and substrings commonly used in HTML documents and texts. This pre-defined dictionary allows Brotli access to these common HTML strings, significantly improving its compression efficiency.
You can recognize the files compressed using Brotli by the content encoding type “br”.
Serving Compressed Files
Our system uses Cloudfront to compress our files and feeds automatically and serve them to viewers. The process works as follows — the viewer (e.g., the browser) sends the “Accept-Encoding” HTTP header to the server when communicating with it to check for compression compatibility. Cloudfront supports both Gzip and Brotli compression formats, but it will serve Brotli by default if the viewer supports both.
Some browsers like Chrome or Firefox support Brotli only on HTTPS. This protocol is the most used one for serving content on the web nowadays.
When content is compressed, it will download faster since the file will be smaller (in some cases, less than a quarter of the original). That is why compressing our player’s javascript files with Brotli led to faster rendering times and a better user experience.
How Brotli Helped Us Reduce Our Player Size and Improve Loading Speed
In our case, using Brotli compression resulted in shrinking our player’s js files by 10%–15%, which led to faster loading times and player feeds.
For instance, our main player’s size was reduced by 12%. That led to our player rendering much faster in viewers’ browsers.
This improvement sped up our player’s loading time to around 50-60 ms. At the same time, various player plugins now load in less than a few ms. The feeds used to serve content to the player are now almost half their size as when using Gzip.
All these efforts helped us provide a better user experience. We understand that UX is becoming an increasingly vital element for all businesses nowadays. People are not as patient anymore when it comes to content serving and loading times, and we are well aware of that.
That is why our team is always working on optimizing user experience using cutting-edge technologies and improving our systems to stay at the top of the video advertising industry. And Brotli compression algorithm is just the beginning.
