合成层

定义

合成层（Compositing Layer）是现代浏览器渲染架构中的概念：页面被拆分为多个图层，各图层独立光栅化后，由合成器线程在 GPU 上按层叠顺序合并成最终画面。

提升条件

常见触发图层提升的因素包括：3D transform、will-change 声明、video 与 canvas 元素、position: fixed（部分实现）、opacity 动画、以及与已提升图层重叠导致的隐式提升等。

优势

提升为合成层的元素在做 transform 或 opacity 动画时，只需合成器线程重新合成，无需主线程参与布局与绘制，因此即使主线程繁忙动画也能保持流畅，这是「GPU 加速动画」的原理。

注意事项

图层并非越多越好：每个图层都占用显存，过度提升会导致内存暴涨与合成开销增加，即所谓「层爆炸」。隐式合成还可能意外产生大量图层，可通过开发者工具的图层面板排查。