javascript - 覆盖非事件选项卡的 setTimeout 行为

Question

我目前正在使用 WebRTC 使用 JavaScript 开发点对点游戏。它将其中一个对等点(即主机)视为服务器，任何其他加入的对等点都通过 node.js 代理服务器连接到主机。

我目前正在尝试解决一个问题，即如果主机切换选项卡使得游戏不再是事件选项卡，游戏将停止为所有人更新。在做了一些研究之后，我发现这是因为我正在使用类似的东西:

setTimeout(callback, 1000 / 60);

在我的游戏循环中。 setTimeout(至少在我关注的 Chrome 和 Firefox 浏览器中)被定义为如果调用它的页面不在您的事件选项卡中，则每秒最多可以调用一次。

我读到 Web Worker 没有此约束，但为了使其正常工作，我需要在 Web Worker 中运行我所有的游戏逻辑。我尝试使用 JSON.stringify() 将我的游戏对象发送给工作人员，但它说该对象有一个循环引用(在游戏循环中)并且无法将其转换为 JSON。所以我不确定该怎么做。

我还研究了实现我自己的计时器，无论页面是否在事件选项卡中，它都会一直运行，但我也不确定该怎么做。

如果这不会产生很大的性能开销，我真的不会遇到任何问题，无论是用这两种方式，还是我还没有想到的其他方式。任何建议将不胜感激。

Answer 1

因此，正如我上面所说，Web Worker 能够调用 setTimeout() 而不会为非事件选项卡延迟 1 秒。我当时的解决方案是创建一个 Web Worker，它只负责调用 setTimeout()(在其 onmessage 事件监听器中调用)。然后，在每个游戏循环结束时我调用:

this.worker.postMessage(null)

有人可能会争辩说，让 Web Worker 承担更多责任比仅调用 setTimeout() 会更有效，因为我已经添加了等待消息在主线程和 worker 之间发送的开销。这是我将来可能会关注的内容。

这样做的主要问题是与 IE 的兼容性； IE 直到 10.0 版本才获得对 web worker 的支持。这对我来说不是真正的问题，但我认为值得一提。