Question

我有一个应用程序执行以下操作：

WebSocket.onmessage
  put bytes into a queue (Array)

on requestAnimationFrame
  flush queue, rendering the received bytes using canvas/webgl

应用程序接收并绘制实时数据。它有一些混蛋/ jank，在分析我的渲染代码时，我注意到虽然实际渲染似乎很快执行，但在WebSocket.onmessage处理程序期间有大量的空闲时间。

我尝试缩小Nat Duca's post中提到的窗口，检查我是否“受GPU限制”。但是，即使是一个小窗口，时间线也会产生相同的结果。

我现在怀疑的是垃圾收集。应用程序从WebSocket读取数据，绘制它，然后丢弃它。所以对我而言，我有一个锯齿形记忆配置文件似乎并不令人惊讶：

所以我的问题现在是双重的：

1）在浏览器中，是否可以避免此内存占用？在其他语言中，我知道我可以拥有一次分配的缓冲区并直接从套接字中读取。但是使用WebSocket接口，这似乎不可能;我正在获得一个新分配的字节缓冲区，我简单地使用它然后不再需要。

更新：---根据pherris的建议，我从等式中删除了WebSocket，虽然我看到了改进，但问题似乎仍然存在。请参阅下面的屏幕截图：

2）这是我的主要问题吗？在这样的应用程序中是否还有其他东西可以避免这种阻塞/空闲时间？