有人可以解释为什么 turnEvenOld(250, 250)
(0.089ms) 的运行速度比 turnEvent(250, 250)
(0.447ms) 快得多吗?
我认为使用 requestAnimationFrame()
比 setInterval()
运行起来更快、更便宜?
setInterval():
var turnEventOLD = function turnEvent(AnX, AnY) {
----VARIABLES----
temp = setInterval(myAnimation1, 1000/60);
function myAnimation1() {
----DRAWINGCANVAS------
-----
----CONDITIONS--------
if (one301 && one401) {
clearInterval(temp);
}
}
}
requestAnimationFrame():
var turnEvent = function turnEvent(AnX, AnY) {
----VARIABLES-----
function render() {
----DRAWING CANVAS-----
------
----CONDITIONS---------
if (one301 && one401) {
---stop requestAnimation--
}
}
(function animloop(){
----CONDTION-----
requestAnimationFrame(animloop);
render();
})();
}
最佳答案
RequestAnimation 帧不一定比 setInterval“快”。它实际上做了一些不同的事情。
setInterval 将等待给定的毫秒数,而 requestAnimationFrame 将等待页面准备好重新绘制。根据 setInterval 调用的时间,setInterval 等待的时间可能比下次重绘之前的时间更短或更长。
最好使用 requestAnimationFrame 进行动画,这样您就可以确保在下一次重新绘制之前更改视觉元素,而不是可能与页面重新绘制不同步。
关于javascript - jsperf 测试 setInterval() 与 requestAnimationFrame(),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27434023/