jsperf testing setInterval() vs requestAnimationFrame()

jsperf testing setInterval() vs requestAnimationFrame()

本文关键字:requestAnimationFrame vs testing jsperf setInterval      更新时间:2023-09-26

有人可以解释为什么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 用于动画,这样您就可以确保在下次重绘之前更改视觉元素,而不是可能与页面重绘不同步。

相关文章:
  • 没有找到相关文章