Reducing the size of Javascript files can reduce your CO2 emissions
I recently read about this in Danny van Kooten’s blog post on the CO2 emission reductions he achieved through reducing the size of his Wordpress plugins.
I was inspired to see what efficiencies we could also make with our AddressFinder plugin. This story follows our investigation, challenges and how we were able to reduce our plugin size by 25%
AddressFinder plugin running on an address form
Can we reduce our file sizes too?
That got me wondering if AddressFinder could also make similar improvements. This would align with our company goals of having a reduced impact on the planet.
Could we reduce the file size of our Javascript code, and consequently reduce the emissions generated through network traffic and CPU utilisation?
When our customers use AddressFinder, they will typically download our Javascript library that runs the autocomplete service on their website. Until now, this library was 23.5 kB of compressed Javascript. The internals of this library include:
- An autocomplete library
- The AddressFinder business logic
- A cross-browser HTTP client
- Several Javascript polyfills
We realised that it may be possible to remove the HTTP client and the polyfills. These were included in the library to allow the service to work on very old browsers, including Internet Explorer 6 (which surprisingly is still used).
Challenges in supporting older browsers
Our desire to reduce the Javascript payload size, while also maintaining support for older browsers, was becoming a challenge. A new approach was required.
The solution is to freeze the library at the current version. This frozen version would be returned to Internet Explorer (version 6, 7, 8 and 9) users.
This would then allow us to drop the support for those rather ancient browsers in the current version, and as a result the HTTP client and the polyfills could be removed.
Result
We were able to carve off 5.9 kB with an end payload of 17.6 kB(compressed). A savings percentage of 25%
Emissions reduction calculation
Each month, our main Javascript library is downloaded 7.9 million times.
The total download reduction in gigabytes is:
7.9 million * 5900 bytes * 1,000,000,000 = 46.6 GB network traffic
Danny’s blog post outlines an approach for calculating the amount of energy needed to transfer 1 GB of data across a modern network connection. He selected an average figure of 0.5 kWh of electricity used for each GB.
46.6 GB network traffic * 0.5 kWh/GB = 23.3 kWh electricity
Most of our customers are in Australia, so we will use the federal average emissions figure:
23.3 kWh electricity * 0.9 kg CO2 / kWh = 21 kg CO2 each month
What does 21 kg of CO2 look like?
Danny compares his emissions with those emitted by driving his car. Funnily enough, his car is a Toyota Yaris — which Matt also drives.
The Yaris has an efficiency of 158.5 g CO2/km.
To emit 21 kg of CO2, you would have to drive this far in the Yaris:
21 kg CO2 / 0.1585 = 132.5 km each month
Savings
We reduced our Javascript payload by about 6 kB. Every month ongoing, our service will have reduced CO2 emissions by the equivalent of 132 km of driving. Not bad.
And, as the use of AddressFinder continues to grow, that 6 kB of Javascript reduction will have greater significance.
As Danny says:
the most important thing is to realise that the choices we make in developing for the web have consequences that really add up at scale
