问题
I have simple transition animation on div element. To prevent unnecessary paint events i applied to it higher z-index and 0 transformation so this div is likely to be on it's own layer. But waterfall chart shows layer composition event thats is likely to occur after each animated tick. I wonder, is this some final layer composition before GPU page render and is inevitable before every change on the page or i just doing sometning wrong?
回答1:
The Compositing event in Timeline is always emitted while updating the animation frame and your former assumption is correct. To validate whether your animated div actually became the layer, look for the Paint events -- these are per layer and there should not be any paint events during the animation if one layer is transitioned relatively to another, provided layer contents do not change. Note also that in recent versions of Chrome (m30+), Timeline shows root of the layer associated with the Paint in event's popover.
Another way to check whether your animated element was promoted to a layer is experimental Layers panel (Enable DevTools experiments in about:flags, restart Chrome, then enable Layers panel in the Experiments tab of DevTools' settings).
来源：https://stackoverflow.com/questions/19693961/layer-composition-in-the-chrome-dev-tools