Browser & Web Performance · Middle · Question 31 of 75

Why are animations with `transform` better than animating `top` for CLS?

1top is not supported in modern browsers
2Transforms are always faster to download
✓Correct answer: Transform animations don't count as layout shifts because they don't change layout

Explanation

Animating top, margin or height moves layout boxes, which can be reported as layout shifts and costs layout work each frame.

Further reading

Test yourself

Take the Browser & Web Performance · Middle quiz: questions and options are shuffled, and you get a review of your mistakes at the end.