Gregory's Server
A while ago @paul_irish and I tweaked the Chrome DevTools Performance Timeline to make it more easy for you to spot + debug non-composited animations.
- Non-composited animations are marked with red triangles
- Upon selecting, you now see the reason + relevant properties for why compositing failed
@paul_irish Most common reason why an animation can’t be composited is that you are animating a property that cannot be composited (such as `height`, or a custom property), but there are also other reasons such as using an `animation-composition` that is not `replace`.
Available from Chrome 131 onwards.