环保文档

据估计，网络行业对气候的影响占全球碳排放量的 2% 到 4%，大致相当于航空业的排放量。计算一个网站的生态影响有许多复杂的因素，但本指南包含了一些减少你的文档网站环境足迹的技巧。

好消息是，选择 Starlight 是一个很好的开始。根据 Website Carbon Calculator 的数据，本网站比98% 的被测网页更清洁，每次页面访问产生 0.01g 的二氧化碳。

页面大小

网页传输的数据越多，所需的能源就越多。根据 HTTP Archive 的数据，在 2023 年 4 月，网页大小中位数需要用户下载超过 2,000 KB。

Starlight 构建的页面尽可能轻量。例如，初次访问时，用户将下载少于 50 KB 的压缩数据——仅为 HTTP Archive 中位数的 2.5%。通过良好的缓存策略，后续导航的下载量可以低至 10 KB。

图片

虽然 Starlight 提供了一个很好的基准，但你添加到文档页面中的图片会迅速增加页面大小。Starlight 使用 Astro 的优化资源支持来优化你的 Markdown 和 MDX 文件中的本地图片。

UI 组件

使用像 React 或 Vue 这样的 UI 框架构建的组件很容易向页面添加大量的 JavaScript。由于 Starlight 是基于 Astro 构建的，因此借助 Astro Islands，这类组件默认情况下加载零客户端 JavaScript。

缓存

缓存用于控制浏览器存储和重用已下载数据的时间。一个好的缓存策略可以确保用户在内容变化时尽快获得新内容，同时也避免在内容未变化时无谓地重复下载相同的内容。

配置缓存最常见的方法是使用 Cache-Control HTTP 标头。使用 Starlight 时，你可以为 /_astro/ 目录中的所有内容设置较长的缓存时间。这个目录包含 CSS、JavaScript 和其他可以安全地永久缓存的捆绑资源，从而减少不必要的下载。

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

如何配置缓存取决于你的网络托管服务商。例如，Vercel 会自动为你应用此缓存策略，无需配置，而对于 Netlify，你可以通过在项目中添加 public/_headers 文件来设置自定义标头。

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

电量消耗

网页的构建方式会影响其在用户设备上运行所需的电量。通过使用最少的 JavaScript，Starlight 减少了用户手机、平板电脑或计算机加载和渲染页面所需的处理能力。

在添加分析跟踪脚本或像视频嵌入这样大量使用 JavaScript 的内容时要小心，因为这些会增加页面的电量消耗。如果你需要分析功能，可以考虑选择一个轻量级的选项，如 Cabin、Fathom 或 Plausible。像 YouTube 和 Vimeo 这样的视频嵌入可以通过等待用户交互时再加载视频来改善。像 astro-embed 这样的包可以为常用服务提供帮助。

托管

网页托管的位置对你的文档网站的环保程度有很大影响。数据中心和服务器集群会产生巨大的生态影响，包括高耗电量和大量用水。

选择使用可再生能源的托管服务商将意味着你的网站碳排放量更低。绿色网络目录是一个可以帮助你找到托管公司的工具。

对比

想知道其他文档框架的比较情况吗？这些使用 Website Carbon Calculator 进行的测试比较了用不同工具构建的相似页面。

框架	每次页面访问的 CO₂	评级
Starlight	0.01g	A+
Read the Docs	0.07g	A+
Sphinx	0.07g	A+
VitePress	0.07g	A+
Docus	0.10g	A
docsify	0.11g	A
mdBook	0.13g	A
MkDocs	0.15g	A
Fumadocs	0.16g	A
Nextra	0.16g	A
Docusaurus	0.25g	B
Mintlify	0.99g	F
GitBook	1.19g	F

数据收集于 2025 年 4 月 12 日。点击链接查看最新数据。

环保文档

页面大小

图片

UI 组件

缓存

电量消耗

托管

对比

更多资源

工具

文章和演讲