使用Javascript或CSS3制作动画？

Question

我一直想知道在性能方面对动画有什么好处 - Javascript或CSS3.在这个页面上,您可以在GSAP,jQuery和CSS3之间进行比较:

http://css-tricks.com/myth-busting-css-animations-vs-javascript/

向下滚动到性能比较.现在我的问题如下:

CSS3迟早会比Javascript更快(在这种情况下是GSAP)吗？那么我们应该使用CSS3编程动画还是使用Javascript编程动画？

更新:另一个网站:

http://greensock.com/transitions/

从现在看来,GSAP在大多数方面比CSS3更快,但在3D转换中CSS3更快.

现在的问题仍然是:CSS3会比GSAP(或其他类似的框架)更快吗？

Answer 1

CSS3 动画比 JavaScript 动画更快、更流畅，因为它们可以通过浏览器/GPU 进行优化和潜在的硬件加速。另一方面，JS 动画通常不太流畅，因为动画的每一帧都必须明确解释并渲染。

此外，JS 动画主要用于不支持相对较新的 CSS3 的旧浏览器。

Answer 2

以下是动画工作原理的近似值：

• CSS3：“请尽可能顺利地过渡。”

• JavaScript（天真的）：“好吧，所以首先你移动到这里，然后你移动到这里，然后这里......你跟上了吗？” [浏览器：]“下定决心！”

• JavaScript（增量计时）：“好吧，移到这里。该死，你太慢了。好吧，移到这里，这样看起来你并没有落后。”

• jQuery：“我不在乎它是如何完成的，就去做吧。再见！”

在我看来，获胜者是 CSS3。