- 原文地址：RenderingNG: an architecture that makes and keeps Chrome fast for the long term
- 原文作者：Chromium Blog
- 译文出自：掘金翻译计划
原文链接：blog.chromium.org/2021/10/ren…
我们对 Chrome 性能提升的持续投入，已经给电池续航，内存占用以及网页渲染速度上带来了显著提升。文章 The Fast & the Curious series 重点介绍了过去几年 chrome 在渲染改进上的历程，这些改进也让 Chrome 浏览器一直保持业界领先。例如，Chrome 94版本相比较93版本就有以下的提升：
- 网页的响应速度提高了 8%
- 每天节省的 CPU 处理时间多达 1400 年
- 电池续航提高了 0.5%
此外，新版本 Chrome 还有以下提升 :
- 图形渲染速度提升了150%
- 可靠性大大提升，在问题设备上 GPU驱动的崩溃率减低了6倍
RenderingNG 是一个长期项目，正如现在用户所体验到的那样，它的目标是要从整体系统层面全方位地提升 Chrome 的性能，同时也要不断地预测和应对面向未来的各种需求。这样就可以确保在网页内容越来越丰富，功能越来越繁杂的情况下，浏览器依然可以保持快速和高效。
8年前我们启动了这个项目，现在我非常高兴地宣布，RenderingNG 的核心项目即将在 2021 年 结束。它不仅仅是让我们现在可以体验到快速高效的互联网内容，更重要的是，这也意味着 Chrome 已经为下一代互联网提前做好了准备。
RenderingNG 由三个部分组成：性能、可靠性和可扩展性。
让我们从性能开始说起。
GPU & 多核
Chrome 之所以能更快地渲染内容，一个主要原因是充分利用了现代设备中的多核CPU以及高性能的GPU。多核意味着我们可以并行处理多种事务。例如，Chrome 在快速显示网页内容的同时可以运行JavaScript代码、滚动页面、解码图像或视频。GPU 则通过 光栅技术 实现最大化的像素并行处理，而不再是逐像素的处理，这带来了显著的速度提升。
而早期的浏览器并不能支持这些技术，因为那时GPU和多核CPU还没有普及。过去的种种尝试也证明，让系统的各个功能组件完美地并行执行是一项非常巨大的挑战，这迫使团队不得不花大量时间来重新构建 Chrome 的整个渲染架构。整个重构工作就是 RenderingNG 项目。
渲染缩放
为了避免因系统资源耗尽而影响用户的体验，浏览器必须重视运行效率。它不能对你使用手机或者电脑的体验造成任何影响，也不能影响到其他应用的多任务使用。同时，浏览器还需要最大限度地延长手机和笔记本电脑的电池续航，防止设备过热（这里要看你的了，CPU冷却风扇！）。最后，浏览器必须能够始终保持运行流畅并且及时响应用户的各种操作。
这就意味着，浏览器需要能够对 GPU 和多线程的使用进行缩放控制，以此在支持多任务、保证电池续航和防止设备过热之间达到一种平衡。举个例子，在所有设备上，网页滚动的同时需要并行地执行 JavaScript，这是非常重要的；否则，用户的操控响应就会很迟钝。而另一方面，有时浏览器却需要减少这种并行处理，因为有时候为了加快渲染速度，电池续航可能比最大限度地使用 GPU 和 CPU 资源更加重要。
事实证明，要保证网页内容不受损失而且浏览器也不会出现无响应的基础上，做到无缝地渲染缩放是一项极大的挑战。RenderingNG 在堆栈中应用了新技术来实现这一点，包括完全重写了合成，允许灵活地使用 GPU 或CPU 计算任意的网页片段，以便为每个网页和设备选择合适的内容。
##性能隔离
第三个关键技术是性能隔离。性能隔离使您能够在后台播放音乐和视频的同时获得阅读电子邮件的良好体验：操作系统（OS）会确保它们互不影响地共享CPU。（这项功能在原生应用程序中已经存在很长时间，我们一直认为这是一件理所当然的事情，但事实却并非如此!)
浏览器虽然已经能够与电脑上的其他应用程序完美地相互隔离（有赖于操作系统的控制），但在网页中，各个组成部分是很难隔离的，例如广告和其他的嵌入内容、视频和音频、动画、滚动、JavaScript以及各种各样的浏览器任务窗口。在早期的网络时代，能简单地让所有这些功能一起工作就已经是一项巨大的成就了。然而现在情况完全不同了，它们需要能够无缝地结合在一起，只有这样才能给用户带来即可靠又快速的用户体验。
RenderingNG 为所有功能实现了性能隔离。
我们大部分工作都集中在如何保证用户体验的可靠性。尤其是在重写一个浏览器的整个渲染堆栈时——这真的是一项艰巨且极具风险的任务。
我们采用了四项关键技术：
最后，我们始终关注一个问题，那就是 web 应用在现在和将来需要怎样发展才能带来越来越好的用户体验。一些应用一直在找寻 web 上能做到什么样的极限体验，甚至尝试去超越这些极限。当这些尝试超出当前web API或者架构的设计范围时，这些 web 应用虽然仍然可以正常使用，但有时使用起来会变得更慢或者更繁琐，并且会给电脑带来更多的负担。我们正在 开发新的API来填补这些空白，这样可以让这些应用使用更加简单的方式去完成这些功能。
可扩展性 从一开始就是 RenderingNG 的一部分，也是让系统整洁和模块化的一个重要原因。
第一个 RenderingNG 的性能优化于2015年发布。下面我们从后续的性能改进中选择一小部分重点介绍。
CompositeAfterPaint: 让所有网页更快响应 [1]
在M94版本中，我们将发布 CompositeAfterPaint, 这是一个新的合成子系统，它允许任意缩放用于 web 应用的 GPU 使用。更妙的是，得益于该子系统专门定制化的算法，CompositeAfterPaint 将带来以下改进：
- 滚动延迟降低 8%
- 响应率提升 3%
- 渲染速度峰值提高 3%
- GPU 内存使用率提升超过 3%
- 减少用于渲染和与选项卡交互的 CPU 时间, 每天可节省超过 1400 多年的 CPU 时间
- 电池续航提升 0.5%
GPU 光栅：比以前快得多[2]
2016年，GPU 光栅技术在 Mac 上发布，MotionMark 总体评测的结果提高了37%， HTML 分类的评测结果提高了150%。随后，一直到2020年，我们为所有其他平台和内容进行了类似的改进。在2021年，我们发布了针对2D Canvas 渲染的更近一步的 GPU 加速提升，在Apple M1 Mac上进行了测试, 路径渲染测试结果提升了1000%，MotionMark 1.2 总体评测结果提升了130%，。
进程外光栅：可靠性大大提高[1]
2018年，在 Android 上发布了进程外光栅。将有问题的 GPU 驱动的崩溃率降低了6倍，使可靠性与其他驱动保持一致。
如果你想了解更多关于 RenderingNG 的内容，请访问 Chrome 的开发者博客，我们将在那里发布关于这个项目完整的系列内容，随后还有更多内容敬请期待。 谢谢您的阅读！
作者 Chris Harrelson, 核心渲染软件工程师
[1] 数据来源: Real-world data Chrome 客户端的聚合信息
[2] 数据来源: MotionMark.
