考虑使用电力和网站

Gerry McGovern 询问我对网站能耗是否有什么见解。毕竟，他写过一本关于数字技术对地球影响的书。他想知道网络技术的具体细节，例如……

如果用 HTML 实现这个功能，它将消耗 3 倍的能量，但如果用 JavaScript 实现，它将消耗 10× 倍的能量。

我认为，如果真的仔细研究，并知道如何精确测量，就能找到这样的例子。假设我想将一个元素在屏幕上移动。如果我在 JavaScript 中编写一个 setInterval 循环，每毫秒将相对定位元素的 left 位置递增一次，我 99% 确定这比使用 CSS @keyframes 动画在相同时间内更改 transform: translateX() 值更耗电。在这个例子中，通常我们更关注性能而不是能耗，但这立刻就很有趣：良好的性能是否与更低的能耗相关？很可能。

研究人员已经对此进行了研究。

我们发现移动 Web 应用的性能分数与能耗之间存在统计学意义上的负相关（中等至大的效应量），这意味着性能分数的提高往往会导致能耗的降低。

他们在 Android 上使用 Lighthouse 分数测试移动 Web 应用。我猜这与其他平台和其他性能指标也相当吻合。

我很高兴目前的研究结果与我逻辑上预期的结果相符。导致性能不佳的事情往往也是耗能的事情。想象一下图像。如果提供过大或未优化的图像，你的性能分数就会降低。想象一下这带来的性能影响。服务器上有两张图像，一张大，一张小。哪一张传输到用户的计算机需要消耗更多电力？大的那张。哪一张需要更多的处理能力来解析和显示？大的那张。哪一张在屏幕上显示期间占用更多内存（这也会消耗电力）？大的那张。

网络传输越少，电力消耗越少。

浏览器需要做的越少，电力消耗越少。

一些每隔几秒钟自动刷新的广告？它不仅令人讨厌，而且浪费带宽，从而浪费电力。每当你必须使用轮询（即反复发出网络请求）而不是基于事件的 WebSockets 时？这都在消耗你可能不需要消耗的电力。

我们知道 CDN 也能提高性能。文件（如图像）无需跨越全球传输，而是来自地理位置更接近的服务器，并且该服务器专为此项工作而设计。这也就是事情对我来说变得有点模糊的地方。

以性能为目标：目标达成。以低能耗为目标，我们达成了吗？

这项研究已经进行过，但不幸的是，我无法仅从摘要中得知结论。在我看来，世界各地的服务器都存储着这些资源的副本，当资源发生变化时，不仅仅是一个服务器更新，而是世界各地的服务器都会更新。在节省请求效率所实现的节省方面，必须在传播和重复存储之间取得平衡。

说到存储效率，我确信仅仅存储在磁盘上的存储所消耗的电力远少于通过网络发送的文件——但它仍然有成本。假设你每次更改文件时都保存一份副本。假设你每次部署网站时都保存网站的完整副本。有用吗？当然。这会消耗电力吗？一定会的。一定需要在两者之间找到一个平衡点。

然而，Gerry 询问的是特定技术。我能想到 CSS 领域中另一件大事：暗模式！同样，它也已被研究过。暗模式可以节省电力。

对于我们测试的一组流行的 Android 应用，暗模式确实可以将全亮度下的显示功耗降低高达 58.5%！就整个手机电池续航时间减少而言，这意味着在全亮度下可以节省 5.6% 到 44.7%，在 38% 亮度下可以节省 1.8% 到 23.5%。

那么比较技术呢？我怀疑这更多的是关于该技术（或语言）正在做什么，而不是语言本身。例如，我可以使用

元素在 HTML 中构建一个可以打开和关闭的小区域。这比在按钮上附加一个点击处理程序来切换视觉上打开和关闭元素的类的区域更节能吗？我有点怀疑。我敢打赌，浏览器正在执行的重新绘制/重新渲染步骤以及背后的语言与电力消耗的相关性较小。然而！如果我让浏览器下载一个 50 KB 的 JavaScript 库只是为了实现我的小打开/关闭元素，那么是的，这确实很重要，并且 JavaScript 版本效率较低。

这样，正如良好的性能通常与更低的能耗相关一样，我敢打赌，遵守最小功耗规则通常也与更低的能耗相关。

厌倦了我对事情的猜测？可以理解。

Jack Lenox 在 Smashing 上发表的文章“如何提高网站性能以帮助拯救地球”更深入地探讨了这个问题。他指出了可以测试你网站的网站。网站碳排放量计算器就是一个例子，它指出：

计算网站的碳排放量是一项挑战，但使用五个关键数据，我们可以做出相当不错的估计：

1. 线上数据传输
2. 网络数据的能源强度
3. 数据中心使用的能源
4. 电力的碳强度
5. 网站流量

测试代码是开源的。

以上是考虑使用电力和网站的详细内容。更多信息请关注PHP中文网其他相关文章！