Перейти до вмісту

Eco-friendly docs

Цей контент ще не доступний вашою мовою.

Estimates for the climate impact of the web industry range from between 2% and 4% of global carbon emissions, roughly equivalent to the emissions of the airline industry. There are many complex factors in calculating the ecological impact of a website, but this guide includes a few tips for reducing the environmental footprint of your docs site.

The good news is, choosing Starlight is a great start. According to the Website Carbon Calculator, this site is cleaner than 99% of web pages tested, producing 0.01g of CO₂ per page visit.

The more data a web page transfers, the more energy resources it requires. In April 2023, the median web page required a user to download more than 2,000 KB according to data from the HTTP Archive.

Starlight builds pages that are as lightweight as possible. For example, on a first visit, a user will download less than 50 KB of compressed data — just 2.5% of the HTTP archive median. With a good caching strategy, subsequent navigations can download as little as 10 KB.

While Starlight provides a good baseline, images you add to your docs pages can quickly increase your page weight. Starlight uses Astro’s optimized asset support to optimize local images in your Markdown and MDX files.

Components built with UI frameworks like React or Vue can easily add large amounts of JavaScript to a page. Because Starlight is built on Astro, components like this load zero client-side JavaScript by default thanks to Astro Islands.

Caching is used to control how long a browser stores and reuses data it already downloaded. A good caching strategy makes sure that a user gets new content as soon as possible when it changes, but also avoids pointlessly downloading the same content over and over when it hasn’t changed.

The most common way to configure caching is with the Cache-Control HTTP header. When using Starlight, you can set a long cache time for everything in the /_astro/ directory. This directory contains CSS, JavaScript, and other bundled assets that can be safely cached forever, reducing unnecessary downloads:

Cache-Control: public, max-age=604800, immutable

How to configure caching depends on your web host. For example, Vercel applies this caching strategy for you with no config required, while you can set custom headers for Netlify by adding a public/_headers file to your project:

/_astro/*
Cache-Control: public
Cache-Control: max-age=604800
Cache-Control: immutable

How a web page is built can impact the power it takes to run on a user’s device. By using minimal JavaScript, Starlight reduces the amount of processing power a user’s phone, tablet, or computer needs to load and render pages.

Be mindful when adding features like analytics tracking scripts or JavaScript-heavy content like video embeds as these can increase the page power usage. If you need analytics, consider choosing a lightweight option like Cabin, Fathom, or Plausible. Embeds like YouTube and Vimeo videos can be improved by waiting to load the video on user interaction. Packages like astro-embed can help for common services.

Where a web page is hosted can have a big impact on how environmentally friendly your documentation site is. Data centers and server farms can have a large ecological impact, including high electricity consumption and intensive use of water.

Choosing a host that uses renewable energy will mean lower carbon emissions for your site. The Green Web Directory is one tool that can help you find hosting companies.

Curious how other docs frameworks compare? These tests with the Website Carbon Calculator compare similar pages built with different tools.

FrameworkCO₂ per page visitRating
Starlight0.01gA+
Read the Docs0.07gA+
Sphinx0.07gA+
VitePress0.07gA+
Docus0.10gA
docsify0.11gA
mdBook0.13gA
MkDocs0.15gA
Fumadocs0.16gA
Nextra0.16gA
Docusaurus0.25gB
Mintlify0.99gF
GitBook1.19gF

Data collected on 12 April 2025. Click a link to see up-to-date figures.