javascript - 在不挂起浏览器的情况下执行 'realtime' javascript

Question

我正在尝试用 Javascript 编写一个简单的音乐音序器。

声音将由 SoundManager2 播放

我很快意识到 setTimeout 和 setInterval 对这种计时毫无用处。它们的准确性根本不够好。

所以我正在尝试的是:

创建一个声音事件队列(一个二维数组 [ note, time ] )

在while循环中处理队列

在伪代码中它可能看起来像这样:

// The queue of time/note values (millisecs)
var q = [[0, C], [250, D], [500, E]]

var begin = (new Date).getTime()

while(q.length > 0 ){
    var now = (new Date).getTime()
    var eventTime = q[0][0] + begin

    if( now >= eventTime){

        playNote(q[0][1]) // Play the note  
        q.shift()       // Now that the note has been played, discard it.
    }
}

通过调试我发现这个方法看起来足够精确(playNote 调用是在它应该的准确时间进行的)。

然而，当“序列”正在播放时，所有其他 Javascript(包括实际发出声音的部分)都被暂停，这不足为奇。

这意味着我在运行序列所需的时间内保持沉默，然后执行对 playNote 的所有调用。

我已经尝试将 while 循环隔离在它自己的函数中，然后通过 setTimeout 调用它，希望这会创建一个后台线程来执行它自己的事情(即播放序列)而不停止所有其他 JS 执行。那行不通

我也尝试过使用 setTimeout 调用 playNote 函数，希望虽然 UI 确实被卡住了，但至少序列可以正确播放，但这也不起作用。

我也尝试过组合，但正如您可能已经猜到的那样，这也不起作用。

所以我的问题是:

如何在运行期间不关闭所有其他代码执行的情况下以精确的时间处理事件队列

Answer 1

我不知道是否有针对旧版浏览器的解决方案，但是web workers旨在在 JavaScript 中进行并行执行。

Chrome 和 Firefox 的最新版本支持它们，我不知道其他浏览器。