使用WICG的显示锁定提案实现更快的Web渲染

by

• Dylan Schiemann

摘要：

Web孵化社区群组（Web Incubator Community Group，WICG）最近引入了展现锁定（Display Locking）提案，该提案允许开发人员和浏览器在页面和应用渲染的时候扩展至大量的内容和组件。

Web孵化社区群组（Web Incubator Community Group，WICG）最近引入了展现锁定（Display Locking）提案，该提案允许开发人员和浏览器在页面和应用渲染的时候扩展至大量的内容和组件。

该提案努力适应多种使用场景，从快速展现非常大的HTML文档，到滚动显示大量内容，到异步预渲染不可见的内容供后续展现，再到更快速地度量布局。该提案试图在不破坏Web特性和布局计算的情况下避免加载和渲染不可见的内容，并且为开发人员提供一种灵活性，使其能够在不向终端用户屏幕展现的情况下将内容预先渲染出来。

目前，DOM是原子渲染的，随着站点和应用规模的增长，渲染也会耗费越来越长的时间。现在，我们所采用的技术包括隐藏不可见的内容或虚拟化，但是这些方式有一些限制，并且面临着可靠性方面的挑战。

展现锁定提案引入了三个新特性：

• rendersubtree属性，控制一个DOM子树是否要渲染。该属性可以被浏览器或其他的用户终端所修改，并且会触发一个MutationObserver事件，开发人员可以对事件进行响应。
• content-size属性，为rendersubtree属性标记为不可见的内容分配一个占位符的大小。
• Element对象的updateRendering方法，预渲染rendersubtree属性标记为不可见的子树中的内容。

在起草该提案时，WICG考虑了多个备选方案，包括contain: strict、display:none、visibility: hidden等CSS属性，但是对于开发人员和用户终端来说，这些方案都缺乏足够的控制。

在现今的Web浏览器中，目前还没有该提案的实现。该提案还处于早期阶段，提案鼓励相关人员加入展现锁定社区群组来提供反馈。Web孵化社区群组(WICG)为提出和讨论新的Web平台特性提供了一个轻量级的场所。每个提案都会在群组的Github账户的repository中进行讨论。该群组的成员资格对所有人开放，但所有参与者必须首先签署W3C社区贡献者许可证协议（W3C Community Contributor License Agreement）。

查看英文原文：Faster Web Rendering with WICG Display Locking Proposal