W3C提出Web Animation API（简称WAAPI）正缘于此，它致力于集合CSS3动画的性能、JavaScript的灵活、动画库的丰富等各家所长，将尽可能多的动画控制由原生浏览器实现，并添加许多CSS不具备的变量、控制以及或调的选项。看起来一切都很棒，是不是以后我们在动画技术选型上可以一招鲜吃遍天了呢？接下来请跟我一起敲开Web Animation API的奇妙之门。

Web Animation API非常的棒。除了能很好的支持平常动画之外。我发现还可以使用Promise、rAF和CSS Transition来重新创建它们，结果类似人体工程学。

这些特性在写这篇文章的时候还没有在任何的浏览器得到稳定的支持。但是，接下来要讨论的内容在Firefox Nightly中得到了支持，而且关键部分在Chrome Canary（开启Web实验性特性），所以我建议使用这些浏览器中的一个（在阅读本文时）。

早期在Web页面或Web应用中实现 Web动画 通常是使用JavaScript来完成。使用JavaScript创建动画非常灵活，但不能轻易地让浏览器通过硬件加速来优化动画，也不能将其连接到 布局 和 渲染 管道中。值得庆幸的是，自2007年Webkit团队引入的 CSS Animation 和 CSS Transition 克服了早期JavaScript动画实现的挑战。但是，CSS Animation和Transition也有很多的限制，特别是在 动态创建动画、控制动画的回放和监视动画生命周期方面等。不过，Web Animation API的出现，让开发者（特别是Web动画方面的开发者）看到了曙光。因为，Web Animation API引入了一种新的解决方案，它提供了CSS Animation和Transition的优化能力，同时还提供了早期基于JavaScript制作动画的API的灵活性。Web Animation API通过 **计时模型（Timing Mode）和动画模型（Animation Model）**提供对Web动画开发和控制。