CSS实现动画真的性能更好么？

Posted 2021-09-13 h3v8rzii

最近在优化页面动画效果时，和同事探讨到了页面动画卡顿的问题，即使大致了解CSS实现的动画会比JS性能更佳，卡顿更少，但是一直没有深究这样的问题原理是什么。这次在优化过程中，发现即使使用CSS动画，但是在使用height，width，margin，padding作为transition的值的时候，依然会卡顿，但是使用CSS transform就会有明显的改善。问题类似就不赘述了，在参考中附一个类似的问题。
这里主要讲一讲CSS到底哪些动画效果帧数高，性能好，背后的原理到底又是什么。