首先，要理解JS的执行是单线程的，在一轮Event Loop的时候，会执行所有同步JS代码。

setInterval的运行机制是，将指定的代码移出本次执行，等到下一轮Event Loop时，再检查是否到了指定时间。如果到了，就执行对应的代码；如果不到，就等到再下一轮Event Loop时重新判断。这意味着，setTimeout指定的代码，必须等到本次执行的所有代码都执行完，才会执行。

每一轮Event Loop时，都会将“任务队列”中需要执行的任务，一次执行完。setTimeout和setInterval都是把任务添加到“任务队列”的尾部。因此，它们实际上要等到当前脚本的所有同步任务执行完，然后再等到本次Event Loop的“任务队列”的所有任务执行完，才会开始执行。由于前面的任务到底需要多少时间执行完，是不确定的，所以没有办法保证，setTimeout和setInterval指定的任务，一定会按照预定时间执行。

所以，我们如果用setInterval去实现动画，当一次执行的JS时间超过了setInterval设置的延时时间，会导致动画看上去卡顿。jQuery实现动画就是用了定时器，所以性能很一般。所以一般建议是用requestAnimationFrame或者css3动画。

requestAnimationFrame比起setTimeout、setInterval的优势主要有两点：

requestAnimationFrame会把每一帧中的所有DOM操作集中起来，在一次重绘或回流中就完成，并且重绘或回流的时间间隔紧紧跟随浏览器的刷新频率，一般来说，这个频率为每秒60帧。

在隐藏或不可见的元素中，requestAnimationFrame将不会进行重绘或回流，这当然就意味着更少的的cpu，gpu和内存使用量。

已了解。之前看了老师的解释但是没明白。后来网上查阅下JS单线程和定时器的工作原理后再看老师的解释就清楚许多了。谢谢。