何时使用 WAAPI
Web 动画 API (WAAPI) 相较于 JavaScript requestAnimationFrame (RAF) 驱动的动画有许多优势，但两者都有其优缺点。根据动画的类型或创建动画的上下文，并非总是能够或推荐使用 WAAPI 而非 RAF。
优先使用 waapi.animate() 的情况：
- 在 CPU/网络负载期间进行动画（参见硬件加速动画部分）
- 初始页面加载时间至关重要且每 KB 都很重要（3KB gzip vs JavaScript 版本的 10KB）
- 动画化 JavaScript 版本无法正确处理的复杂 CSS 值，例如 CSS 变换矩阵或 CSS 颜色函数。
使用 animate() 的情况：
何时使用 WAAPI 代码示例
import { animate, waapi, utils } from 'animejs';
// WAAPI Animation
waapi.animate('.waapi.square', {
x: '17rem',
rotate: 180,
loop: 3,
alternate: true,
});
// JS Animation
const data = { x: '0rem', rotate: '0deg' }
const [ $log ] = utils.$('code');
animate(data, {
x: 17,
rotate: 180,
modifier: utils.round(0),
loop: 3,
alternate: true,
onRender: () => $log.innerHTML = JSON.stringify(data)
});<div class="medium row">
<div class="square waapi"></div>
</div>
<div class="small row"></div>
<pre class="medium centered row">
<code>{"x": '0rem',"rotate":"0deg"}</code>
</pre>