通过碳预算减少网站的环境影响

在我写这篇文章的时候，世界各国领导人正在格拉斯哥参加 COP26，即国际气候变化大会，试图通过承诺结束其国家对化石燃料的依赖来阻止（或至少减缓）灾难性的气候变化。只有时间才能证明他们是否会成功（剧透：情况不容乐观），但越来越清楚的一点是，我们科技行业不能再把头埋在沙子里。我们都有责任确保我们的星球对子孙后代宜居。

很容易将气候变化与网络脱钩。毕竟，我们大多数人每天都在办公桌前坐着。我们没有亲眼看到网络产生的排放。但根据BBC 在 2020 年的一份报告，互联网占全球碳排放量的 3.7%——而且还在上升。这使得我们这个行业的碳排放量与整个航空业相当。因此，当我想到我们可以做些什么来使我们的网站“更好”时，我立即想到的是如何使它们对地球更好。因为，不管我们是否喜欢，我们的网站产生的碳排放不仅会影响我们自己的用户，还会影响所有不使用我们网站的人。我们当然有很多工作要做。

网页越来越臃肿，这已经不是什么秘密了。现在，网页的平均大小约为2MB。这对用户来说是个坏消息，因为他们在缓慢的连接上浏览如此臃肿的网站的体验会非常糟糕，但对地球来说也是个坏消息。性能差和能耗高往往是并存的。但幸运的是，这意味着修复其中一个将在很大程度上帮助修复另一个——这是一个双赢的局面。那么，我们可以做些什么来改善我们网站的环境影响（以及通过扩展来改善用户体验）呢？

我的建议是我们需要为我们的网站设定碳预算。

网络开发中的性能预算并不是一个新概念，在许多方面与碳预算息息相关。优化性能通常会对网站的能源效率产生积极影响。但是，一个可量化的碳预算也帮助我们通过可持续发展的视角看待网站的各个方面，并可能帮助我们考虑性能预算本身不会涵盖的方面。

我们如何开始为我们的网站计算碳预算？由于需要考虑许多因素，因此计算网页产生的碳排放量很困难：开发过程中使用的电力、托管我们文件的 datacenter、数据传输本身、最终用户设备消耗的电力等等。每次构建网站时，我们几乎不可能自己进行计算。但是 Wholegrain Digital 的网站碳排放量计算器工具可以估算给定网站的碳足迹，这为我们提供了一个良好的起点，可以从这里开始思考这些问题。

让我们以COP26网站为例。通过碳排放量计算器运行此网站会显示一些相当令人震惊的结果：该网站比该工具测试的 94% 的网页都更“脏”（即碳密集度更高）。在 DevTools 中检查主页，我们可以看到整个页面传输的数据约为 6.4MB——远远高于平均水平，但遗憾的是并不罕见。进一步检查发现，来自社交媒体嵌入（包括 YouTube 视频嵌入）的 JavaScript 是主页上最严重的罪魁祸首之一，对页面权重贡献很大。Fershad Irani 已经写了这篇关于该网站不足之处以及如何解决这些不足之处的详细分析。（直到几天前，总大小为 8.8MB，包括一个 3MB 的 PNG 图像。由于 Fershad 向 COP26 团队强调了这一点，该图像现在已被替换为一个更小的版本。）

通过了解设计中的哪些元素对性能影响最大，我们可以了解一些最大的碳减排可能在哪里，并开始权衡取舍。每个网站的碳预算可能都需要有所不同——例如，需要大量运动和交互式内容的网站可能不可避免地会使用更多资源。但是也许对于像这样的简单网页，我们可以将目标定为每页浏览量低于 1g 的碳？当我们想到像 COP26 这样的网站在会议期间会积累多少次页面浏览量时，这可能会产生巨大的节约。

一旦我们能够确定可能的碳减排在哪里，我们就可以采取措施。Wholegrain Digital 的文章“使您的网站更节能的 17 种方法”是一个好的开始。我还建议阅读 Tom Greenwood 的《可持续 Web 设计》，以获取关于全面减少我们构建的网站的环境影响的实用指南。网站可持续 Web 设计提供了一些优秀的开发资源。

至于说服客户接受碳预算的想法，使用核心 Web 指标来开始对话是一个好的开始。使用像Lighthouse这样的工具，我们可以看到网站的哪些方面对性能影响最大以及核心 Web 指标是如何受到影响的。看到代码对客户网站性能评分的影响（这可能会影响 Google 的搜索排名）可能足以说服他们。

很高兴看到 Google（以及其他行业领先公司）在这方面带头，并在 Lighthouse 等工具中构建碳计算功能。通过将这些信息置于首位，他们可以在赋予开发人员做出更环保的决策方面发挥重要作用——并表明他们言行一致。（实际上有一个关于此的开放的 GitHub 问题。）也许我们还需要某种行业范围内的认证，正如 Mike Gifford 在这篇文章中探讨的那样。

我们可以做更多的事情来改善我们网站的碳足迹。现在是网络行业 heed 这一警钟的时候了。用格蕾塔·桑伯格的话来说

没有人太渺小而无法改变世界。