JavaScript：使用队列进行网络通信

Question

我正在开发一个项目，其中客户端必须能够通过 WebSocket 与服务器进行通信。由于我们开发的应用程序对用户输入具有高度响应能力，因此我们决定让 WebWorker 通过网络进行所有通信，以便缓慢的连接不会中断 GUI。到目前为止效果很好。

现在我们考虑了如果网络速度慢且要发送的消息量很大时需要进行的优化。由于这些消息中的大多数仅用于同步其他一些客户端用户界面，因此我们可以在必要时删除其中一些消息。但要做到这一点，我们需要能够检测拥塞情况。

我们提出了队列的想法：每条要发送的消息都被推入队列中，WebWorker 除了永久迭代队列并发送它在队列中找到的所有消息之外什么也不做。这样，如果队列中有一定数量的元素（即消息发送太慢），我们可以让 Worker 采取不同的行为。这个想法简单明了，但实施起来似乎并非如此。

var ws;
var queue = new Array();

function processMessageQueue() {
    while(true)
        if(queue.length > 0) ws.send(queue.shift());
}

self.addEventListener('message', function(e) {
    var msg = e.data;
    switch(msg.type) {
        case 'SEND':
            queue.push(JSON.stringify(msg));
            break;
        case 'CREATE_WS':
            ws = new WebSocket(msg.wsurl);
            ws.onmessage = function(e) {
                self.postMessage(JSON.parse(e.data));
            }
            processMessageQueue();
    }
}, false);

正如您所看到的，工作线程在收到消息后立即创建 WebSocket。然后，它执行 processMessageQueue() 函数，该循环通过 WebSocket 发送数据来永久清空队列。现在，我的问题是似乎无法将消息推送到队列中。当“SEND”类型的消息到达但由于 Worker 太忙而无法处理任何事件时，这种情况应该会发生。因此它可以循环队列或推送消息，但不能两者兼而有之。

我需要的是一种以某种方式将数据推送到该队列上的方法。如果这不容易实现，我想知道是否有人可以想出另一种方法来找出消息何时到达比发送更快。有什么提示吗？

提前致谢！

Answer 1

您必须给工作人员时间来处理 onmessage 事件。执行 while(true) 将占用所有处理时间，并且不允许执行任何事件。

例如，您可以将其更改为

function processMessageQueue() {
    if(queue.length > 0) ws.send(queue.shift());
    setTimeout(processMessageQueue, 50);
}