javascript - 为什么 requestIdleCallback 给我超过 16 毫秒的时间

Question

我认为我们的代码执行时间大约为 16 毫秒，因为渲染速率为 60 fps，所以 1000/60 = ~16 毫秒。但是，如果我在 Chrome 中运行它:

requestIdleCallback((deadline)=>{
    console.log(deadline.timeRemaining(), deadline.didTimeout)
});

timeRemaining 给我 49.9ms 的时间。这是否意味着 Chrome 不会每 16 毫秒重新渲染一次？我假设在这种情况下是正确的，如果没有任何变化，则无需重新渲染。

Answer 1

规范支持您的假设。在 Start an idle period algorithm它说:

7. Let deadline be a time in the future until which the browser expects to remain idle. The user agent should choose deadline to ensure that no time-critical tasks will be delayed even if a callback runs for the whole time period from now to deadline. As such, it should be set to the minimum of: the closest timeout in the list of active timers as set via setTimeout and setInterval; the scheduled runtime for pending animation callbacks posted via requestAnimationFrame; pending internal timeouts such as deadlines to start rendering the next frame, process audio or any other internal task the user agent deems important.

(我的重点)

因此，如果存在渲染下一帧的内部挂起超时，则截止日期必须在此之前。