GSAP绩效&结构

没有"html5 animations"这回事。

主要有CSS3动画(带有CSS过渡或CSS动画)和Javascript动画。

CSS3动画通常优化得很好(有一些怪癖)，但缺乏支持(旧的ie)和灵活性(你必须使用JavaScript来调整它们)。它们最适合用于悬停效果(带过渡)或基本动画。

JavaScript转换过去是基于setInterval的。一个定时循环，在这个循环中，样式是改变的。JQuery可以做到这一点，但不是很好。

最近，windows . requestanimationframe()被引入来取代这些setInterval动画。支持是有限的(旧的ie)，性能是一流的(因为浏览器可以跳过帧)，并且它总是在内部更新样式。

GSAP所做的是使用这个requestAnimationFrame()，同时优化更少的重绘和添加很多有用的功能(反向，时间线，交错…)在基本动画上，你可以用CSS3或你自己的JS代码实现相同的性能。如果你知道该怎么做。

还有其他动画(画布，svg…事件webgl)，但更专业

在我使用GSAP的有限经验中，以及在与Velocity.js开发人员的一些讨论中，似乎GSAP有一些非常复杂的代码，很难解释;我不确定这是因为他们故意混淆代码还是他们做了一些非常疯狂的优化……也许两者都有一点。他们可能还采用了本地代码并创建了Javascript实现。无论如何，这使得阅读源代码变得相当困难。

只要你的问题关于HTML5动画,这我要带去意味着动画没有Javascript DOM对象,如果你使用兼容的浏览器,您可以实现许多动画通过CSS transform和transition属性,前者是关于DOM对象转换(向左移动10 px),后者是关于物体的变换(它移动线性经过一段时间的,或者使用用户指定的三次贝塞尔曲线描述其运动?)。对于当前兼容的浏览器，除了厂商前缀(如-webkit-和-moz-)之外，这些属性的主要区别很小。这意味着，如果使用前缀，您可以在这些浏览器上可靠地获得DOM对象上的动画。您可以使用这些转换/转换属性来操作几乎任何DOM对象属性。

在速度方面，这取决于。CSS动画通常比Javascript更快，但它缺乏控制，因为它很难/不可能操纵某些属性，如关键帧。Javascript动画较慢，但使用一个好的库可以忽略这个差异，在某些情况下，Javascript动画可以更快。这取决于你想要达到什么目标。由于这里列出的一些原因，CSS和较新的Javascript库动画比jQuery快得多。

*:当然，一些浏览器，如IE9和ie10，虽然相对兼容，但确实遗漏了一些属性，并且在渲染引擎上有一些怪癖。