关于动画播放的一些记录(setInterval和requestAnimationFrame)

FPS （每秒传输帧数(Frames Per Second)）

FPS 表示的是每秒钟画面更新次数。我们平时所看到的连续画面都是由一幅幅静止画面组成的，每幅画面称为一帧，FPS 是描述“帧”变化速度的物理量。

  理论上说，FPS 越高，动画会越流畅，目前大多数设备的屏幕刷新率为 60 次/秒，所以通常来讲 FPS 为 60 frame/s 时动画效果最好，也就是每帧的消耗时间为 16.67ms。

  对于不同帧频的用户体验大致如下：

• 能够达到 50～60 FPS 的动画将会相当流畅，让人倍感舒适；
• 在 30～50 FPS之间的动画，因各人敏感程度不同，舒适度因人而异；
• 在 3 FPS 以下的动画，让人感觉到明显的卡顿和不适感；
• 波动很大的动画，亦会使人感觉到卡顿。

动画播放与FPS的关系

1. setInterval

按照指定的周期（以毫秒计）来调用函数或计算表达式。方法会不停地调用函数（当页面被隐藏或者最小化时，setInterval()仍在后台继续执行，这种动画刷新是完全没有意义的，对cpu也是极大的浪费），直到 clearInterval() 被调用或窗口被关闭。

setinterval的执行时间不确定，参数中的时间间隔是将代码添加到异步队列中等待的时间。只有当主线程中的任务以及队列前面的任务是执行完毕，才真正开始执行动画代码。所以很多场景下并<