javascript - WebSocket 消息每隔几秒就会断断续续

Question

我正在尝试构建一个使用 WebSockets 的游戏。碰撞检测和游戏状态在服务器上处理，大约每 16 毫秒运行一次游戏循环。每次迭代，它都会向所有玩家发送一条带有更新状态的消息，这些玩家会更新本地副本并渲染游戏。

大约一半的消息可以正常到达，但有时会有数百毫秒的游戏时间立即到达的批次。

我创建了一个最小的测试用例，它每 16 毫秒发送一次当前时间戳。在客户端上，您可以看到它每隔几秒缓冲一次消息：

我已经分析了应用程序，并且在该 gif 的持续时间内只有一个丢帧，否则它保持一致的 60fps。

我猜 GC 可能是其中一个延迟的原因，但至于其他和解决这个问题，我很困惑。

应用程序本身是 Vue，但是游戏部分是用纯 JS + Canvas 实现的。

标签： javascriptperformancecanvaswebsocket

Answer 1

您的游戏循环是否使用 Window.requestAnimationFrame()？我会尝试单独运行 websocket 代码，就像在计时器中一样。

您还可以尝试 websocket 刷新的其他值，例如 36 毫秒、60 毫秒、120 毫秒，看看这个问题是否仍然存在。也许在浏览器或服务器端有太多的请求和一些缓存。

我无法重现您的问题，您应该确保这是因为 GC。（如果是这种情况，您可以尝试消除繁重的 GC 调用（尝试重用对象/数组）。或者您可以以某种方式在 Web Worker 中使用您的 websocket 代码，但是如果 GC 运行，则主线程被阻塞，因此您可以也将逻辑放入网络工作者中，但这只是一个疯狂的猜测，无论如何你可以在没有游戏逻辑的网络工作者中测试通信，只是时间戳值）。