07 — cc 合成器与 viz ​

cc 和 viz 是 Chrome 渲染链路里常被问到的两个名字。

cc 是什么 ​

cc 负责把 Blink 生成的绘制结果组织成可光栅、可合成的结构，最终产出 CompositorFrame。

可以理解为：Blink 决定“画什么”，cc 负责“如何把这些内容变成可提交的帧”。

为什么有 Pending / Active 树 ​

多线程合成里，cc 通常有几份状态：

• 主线程树：Blink 更新样式、布局、图层。
• Pending 树：等待光栅化的新内容。
• Active 树：当前真正用于显示和滚动的内容。

这样做的好处是：新内容还没准备好时，旧的 active 树仍然可以继续滚动或动画，避免半成品上屏。

viz 是什么 ​

viz 是显示合成相关组件，负责聚合多个来源的 CompositorFrame，并最终提交到 GPU / 屏幕。

例如跨进程 iframe 各自产生帧，viz 需要把它们聚合成最终页面。

和前端性能的关系 ​

• transform、opacity 等属性更容易走合成路径。
• 过多合成层会增加内存和光栅成本。
• 滚动是否流畅，取决于能否在线程化合成路径处理，以及 tile 是否准备好。
• 同步 wheel / touch 监听可能迫使输入回主线程，导致滚动变卡。

总结 ​

Blink 生成绘制记录，cc 负责光栅和合成准备，viz 聚合并提交最终帧。Pending / Active 设计是为了让新内容准备时，旧帧仍可流畅滚动和显示。