Making Sustainable Websites
Tags: javascript, sustainability, webdev, discuss
Published: 2022-01-08 07:32:27

Over the past few years, hundreds of people have died in climate change-related natural disasters all over the world and experts say it will only keep getting worse if measures are not taken.

From summer of fire and record floods to freak frosts and locust invasions, experts say man-made climate change is wreaking havoc on the world's weather.

But what does that have to do with web development?

Should you as a web developer do anything, apart from putting your PC/Mac to sleep, when you leave it for lunch?

Well, it's relevant for _everyone_, but it's important for web developers, because we develop websites for the internet — **that currently consumes 416.2TWh annually.**

That's more energy than the entire UK!

According to [Website Carbon](https://websitecarbon.com/) :

> The average web page tested produces 1.76 grams CO2 per page view. For a website with 10,000 monthly page views, that's 211 kg CO2 per year.

When you think of the major industries contributing to those emissions, few suspects that come to mind are energy, aviation, agriculture etc. But you will be surprised that global internet usage contributes to **~3%** of global carbon emissions which is equivalent to carbon emissions of the entire aviation industry.

> Did you know we need to cut by 60% of our net global emissions by 2060 to stabilize the climate and prevent catastrophic effects from global climate change? And that’s a conservative estimate.


![Image showing pollution caused by industries](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y42fx2l6d0ifn09lz6ra.jpg)

#### Power Of Compounding

In February of 2020, a web developer named Danny Von Kooten decided to update a popular Wordpress plugin that he created and maintains, [Mailchimp for Wordpress](https://www.mc4wp.com/) . The change? Remove one, 20kb javascript dependency. The impact? [An estimated reduction in global emissions of 59kg CO2](https://dannyvankooten.com/website-carbon-emissions/) per month.

when you reduce complexity in one area, it compounds into others — a 20kb reduction in javascript isn’t _just _20kbs less for the end user — it’s 20kb less on the server, 20kb less on the CDN, 20kb less for the user, _and_, in the case of Javascript (one of the most CPU-intensive assets we can serve on the web), many saved computational cycles. The net effect is far larger than the initial reduction.

#### Measure To Reduce Carbon Emissions

Let's have a look at some of the things we can easily do:

- Choose a green hosting provider

To know whether you are using green hosting provider or not, you can visit [The Green Web Foundation](https://www.thegreenwebfoundation.org/)

If your website is green, you receive a flair!


![Image showing green web foundation badge when website is using green hosting provider](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rwmsughfq2h9lwmumasz.png)

- Choose a green CDN

For CDN's, almost the same principles apply, as when choosing a hosting provider.

You shouldn't have to worry about the location of the CDN, as most of them have locations all over the world, and thus will place your data close to it's core user base.

- Prevent battery-drain

If the website is heavy on Javascript and assets that will lead to faster discharge of battery. Here is where web developers can actually do something !

Try to use Javascript only when needed.

Javascript provides Observers that can greatly impact website like IntersectionObserver, MutationObserver, ResizeObserver, PerformanceObserver. Try to use these observers in scenarios applicable.

- Reduce network-traffic

The **most important** thing you can do to lower your website carbon emissions, is by reducing the network-traffic on your site.

Some of the implementations that we can do are **use of lazy loading images, responsive images correctly, lazy loading videos, do not auto play videos, caching strategies.**

- Simplify the user-journey

I think everyone have tried to look for "shipping cost" on an ecommerce-site, and, not being able to find any relevant information, added an item to the basket.

With _still _no info on "shipping-cost", I've personally then filled out dummy contact-details until I _finally _reached a page with the calculated shipping-cost — which were then too high, and I abandoned the site!

I've no idea what the carbon emission footprint is for all these sites with miserable user-journeys, but I assume it's a lot!

So, **focus on simplifying the user journey and provide insights and information as easily as possible!**

The web can be sustainable, and in making it sustainable, we can ensure that its treasures are available and accessible to all, now and into the future. The web is the largest, publicly-accessible library we have ever known. It’s worth asking ourselves — what can we do to make sure that it lasts, for generations to come?

#### Resources

- Test your own website at [websitecarbon.com](http://www.websitecarbon.com/)
- [Sustainablewebdesign.org](http://sustainablewebdesign.org/) is a fantastic resource, with detailed strategies you can employ as a designer, developer, or company leader.
- [A Book Apart](https://abookapart.com/products/sustainable-web-design/) has a whole book on it!

Thanks for reading!

Please comment your thoughts on the same topic and how did you like the blog post!!

Do like and save in case you find it interesting and helpful!!