Javascript setTimeout 性能与手动检查

Question

我正在编写一个 WebGL 游戏，我很好奇通过检查是否应该在 requestAnimationFrame 的每次更新（使用 Date.now() ) 或通过设置超时（使用 setTimeout()）。

请注意，事件通常相隔约 100 毫秒。

我主要担心的是 setTimeout 在闲置时（等待下一个事件）不会浪费 CPU，如果我在每次更新时都进行检查，我会做一些不会发生的计算如果我使用 setTimeout

Answer 1

我认为正确的做法是使用 requestAnimationFrame。

如果您已经在 requestAnimationFrame 中，我认为最好检查当前时间和任何未决事件，并基本上完成您可以做的任何工作。

A setTimeout 需要一些非常像上下文切换的东西，这是不必要的开销，当然，如果事件导致更新屏幕，您要么必须执行更新 "now"，或者安排在下一个requestAnimationFrame中去做，都不必要的复杂。

Answer 2

如果您需要事件，请创建 Events 并使用 eventListeners。

如果您需要在每次调用 rAF 时检查条件是否已更改以执行某些操作，只需在 rAF 循环中进行检查。

注意：您不需要并且应该避免在每次调用时创建一个新的日期对象；有一个时间戳作为请求函数的唯一参数通过 rAF 传递，使用它。

function update(timestamp){...};   
requestAnimationFrame(update);

高速使用 setTimeout 只会对 timedout 函数进行无用的调用，该函数将被推到要执行的任务堆栈的顶部。

将检查嵌入 rAF 循环的顶部同样好。

Javascript setTimeout performance vs manual check