【CSS】优化动画性能
最核心要开启gpu加速。
建议使用requestAnimationFrame，如果用js修改元素的位置，推荐使用这个API。
定时器时间不准确，requestAnimationFrame 始终在当前帧的最后执行。
利用css3 translate进行元素移动
在 CSS3 中，可以使用 transform 属性的 translateZ 函数或 translate3d 函数来开启 GPU 加速。这些函数会创建一个新的图层，浏览器会使用 GPU 来渲染这个图层，从而提高性能。
例如，你可以使用以下代码来开启 GPU 加速：
.element {
transform: translateZ(0);
}
或者：
.element {
transform: translate3d(0, 0, 0);
}