How Your Bundle Size Affects The Climate

An unoptimized 10MB website requires 28 trees to compensate for its carbon output. Discover how to shrink your bundle size and build a more sustainable web.

#1about 1 minute

The growing impact of websites on the climate

The increasing size and usage of websites have a direct and growing impact on global energy consumption and the climate.

#2about 3 minutes

Website size and data center energy consumption are exploding

The average website is four times larger than a decade ago, and data centers now account for a significant percentage of national energy usage.

#3about 6 minutes

How modern internet usage habits drive data consumption

Increased daily screen time, the shift to mobile-first browsing, and the rise of e-commerce are key drivers of higher internet data consumption.

#4about 4 minutes

Why large JavaScript bundles are bad for users and the planet

Large JavaScript bundles not only create slow user experiences by consuming bandwidth but also strain device CPUs, increasing energy use on both ends.

#5about 4 minutes

Comparing the simple web of the past to today's complex sites

A look back at websites from a decade ago reveals a shift from simple text and low-res images to today's media-rich, interactive, and heavier applications.

#6about 6 minutes

The shift from jQuery to modern JavaScript frameworks

Web development has evolved from using jQuery for simple interactions to building entire applications with powerful but heavier frameworks like React, Angular, and Vue.

#7about 5 minutes

Measuring a website's carbon footprint with online tools

Tools like Website Carbon estimate a site's environmental impact by analyzing data transfer, CPU intensity, and the data center's energy source.

#8about 5 minutes

Case study of a bloated website's high carbon footprint

Analyzing a deliberately heavy website with a 10MB bundle reveals a massive carbon footprint, equivalent to driving an electric car for thousands of kilometers.

#9about 4 minutes

Case study of a minimal website's low carbon footprint

In contrast, a simple static HTML site with a tiny 20KB footprint is shown to be extremely energy-efficient, requiring almost no carbon offset.

#10about 5 minutes

Using static site generators and Jamstack for efficiency

Building websites with static site generators (SSGs) and the Jamstack architecture pre-renders pages, resulting in smaller bundles and faster performance.

#11about 4 minutes

Understanding Jamstack architecture and incremental static generation

The Jamstack decouples the frontend from backend services, and incremental static generation (ISG) optimizes build times for very large sites.

#12about 3 minutes

Compressing assets with Gzip and Brotli for smaller transfers

Implementing server-side compression like Gzip, and especially the more efficient Brotli, significantly reduces the amount of data transferred to the user.

#13about 3 minutes