Data Compression for the Web. Why do we need It?
Data compression refers to reducing the data file size sent from web servers to browsers. As internet use has increased exponentially, faster load times and reduced bandwidth usage are needed. This is where data compression comes into play.
A key benefit of data compression is that it significantly improves site speed, leading to a more seamless user experience. Faster load times can translate into increased user engagement and higher business conversion rates. Data compression also decreases the amount of data transferred between the server and client, reducing bandwidth usage, which is especially useful for users with data limitations.
Brotli Compression: Its Origins
Brotli is a data format specification for data streams compressed with a specific combination of the general-purpose LZ77 lossless compression algorithm, Huffman coding, and 2nd order context modeling. The Brotli compression algorithm was developed by Jyrki Alakuijala and Zoltán Szabadka, engineers at Google, and released in 2013 under the MIT free software license.
Brotli was developed as a more efficient alternative to existing compression algorithms. Specifically, it was designed to outperform GZIP, the web’s most widely used data compression algorithm at the time.
Brotli Compression vs GZIP Compression
The primary differences between Brotli and GZIP are their respective speeds and compression rates. Both algorithms provide lossless compression, meaning no data is lost in the compression and decompression processes. However, Brotli generally achieves better compression ratios than GZIP, meaning it can compress data to a smaller size.
While GZIP performs well on text, Brotli performs well on text and mixed content, making it a versatile choice for modern websites incorporating various content types. Moreover, Brotli’s decompression speeds are comparable to GZIP’s, meaning there’s typically no trade-off in decompression time for the enhanced compression.
Despite Brotli’s advantages, GZIP remains the more widely used due to its long presence in the industry and broader support across older browsers and systems.
Checking Whether Your Site Uses Brotli Compression
You can check whether your website uses Brotli compression by inspecting the headers of your website’s HTTP response. Here are a few ways to do this:
Web Browser DevTools: Open your website in a browser like Chrome or Firefox, then open the developer tools (usually F12). Navigate to the Network tab, refresh the page, and click on the main document request. Look at the ‘Response Headers’ section for ‘content-encoding’. If it says ‘br’, your website uses Brotli compression.
Command Line with curl: If you have curl installed on your system, you can use the following command:
curl -I -H 'Accept-Encoding: br' https://yourwebsite.com
This will display the headers for your website. Look for ‘content-encoding: br’ to confirm if Brotli is being used.
Enabling Brotli Compression for Your Site
Depending on your specific setup, there are several ways to enable Brotli compression on your website. Let’s discuss a few common scenarios.
WordPress: If your website is built with WordPress, you can enable Brotli compression using a plugin like Breeze, which supports both Brotli and GZIP compression. Once installed, you can configure the plugin to use Brotli from the settings page.
Nginx: To enable Brotli with Nginx, you’ll first need to ensure that the Brotli module is installed. Once done, you can enable Brotli compression by adding the following to your configuration file:
brotli on;
brotli_static on;
brotli_types text/plain text/css application/javascript application/json image/svg+xml application/xml+rss;
Then restart your Nginx server.
Apache: With Apache, you need to use the mod_brotli module. Once installed and enabled, add ‘AddOutputFilterByType BROTLI_COMPRESS’ to your .htaccess file followed by the MIME types you want to compress.
Cloudflare: If you’re using Cloudflare, Brotli compression can be enabled by going to the Speed section of your dashboard and toggling on the Brotli setting.
How can a reverse proxy help you?
A reverse proxy is a server that retrieves resources on behalf of a client from one or more servers. These resources are returned to the client as though they originated from the reverse proxy. A reverse proxy can be configured to perform additional compression on content before it’s sent to the client.
For instance, you could have an origin server without Brotli compression capability, but a reverse proxy server could fetch the uncompressed content, compress it using Brotli, and then send the compressed data to the client. This enables sites to use Brotli compression even if their origin server doesn’t natively support it. Providers like Cloudflare and other CDN services often use this approach.
Using a reverse proxy for compression can also offer performance benefits. Because the reverse proxy handles compression, the origin server can be freed up to handle other tasks. Additionally, if the reverse proxy and the client support HTTP/2, the data can be streamed to the client while it’s being compressed, reducing the time it takes to load.
Conclusion
Brotli is a powerful tool for enhancing your website’s performance. Whether you’re using a WordPress site or running your server with Nginx or Apache, Brotli’s superior compression rates can deliver a smoother and faster user experience.