A constant challenge for a website is to achieve the best possible visitor experience. As a CMS provider, we know that optimizing the size of files sent to the browser can dramatically shorten the time it takes for a page to load. Faster page load times lead to more and happier users, a lower bounce rate, and better Google rankings.
Wondering if the cost of the payload can be reduced, we have done some research on JSON compression. Very soon we stumbled upon statements like this one on Reddit, with a notable final response:
[QUESTION] Looking to compress JSON significantly. Any suggestions?
“Have you looked into brotli? You can get pretty good compression (generally better than gzip) at level 11”
Or, as one of the existing compression libraries, “brick.json”, states in its Readme file:
You may already have heard of Brotli. Reading up, we found some more and some less relevant details:
As we are using AWS CloudFront for delivering assets to our and our customers’ websites, we wondered why they were transferred using the less modern gzip content type on some sites.
Is this specific asset served with Brotli (br) compression?
curl https://www.example.com/my_asset.js -o /dev/null -v \ -H "Accept-Encoding: deflate, gzip, br" 2>&1 | grep content-encoding < content-encoding: gzip
Obviously not. We had scanned the settings in the AWS console, and they looked good. The default CloudFront policy has Brotli enabled. So, why didn’t it work out of the box?
We assumed that Brotli wasn't applied to CloudFront distributions created before AWS had added the new compression feature. But there was no definite hint in the docs.
At third glance, we discovered this little gem: An option, set to some magic legacy setting.
To get there in the AWS console:
Now, change “Use legacy cache settings” to “Use a cache policy and origin request policy” and confirm by clicking “Yes, Edit.”
Because of CloudFront's conservative caching, it didn’t seem to make a difference at first. But every asset uploaded after this adjustment was in fact served with Brotli encoding!
< content-encoding: br
A two-digit percentage drop in bandwidth usage, with a negligible decompression overhead, for free! Merely by verifying and adjusting the settings.
If you aren’t sure if your assets are already compressed by Brotli, we highly recommend you to have a look!
Regarding the findings about JSON compression (in short):
Using Brotli compression is the proper approach to server-to-client communication.
Half of the existing JSON compression libraries would actually make the compressed payload bigger and also add a computational overhead to it.