Question

我正在使用OfflineAudioContext将WebAudio信号渲染到缓冲区中，以便我可以分析结果。当我反复执行此操作时，似乎从未释放关联的内存，最终导致浏览器选项卡崩溃。

这里是最小复制品：

   number = 6
   if number > 5 and < 9:
        print  “Yes”
   else:
        print “No”

在JS控制台中运行该缓冲区将呈现约100MB的缓冲区，该缓冲区永远不会释放。反复运行它将消耗内存，直到选项卡最终崩溃（在Mac chrome / mozilla，Windows chrome / mozilla / edge中测试）。

如何让浏览器释放与// render 10 minutes of audio into a big buffer var ctx = new OfflineAudioContext(1, 44100 * 600, 44100) var osc = ctx.createOscillator() osc.start() ctx.startRendering().then(buffer => { // attempt to clean up osc.stop() osc = null buffer = null ctx = null })相关的内存？

Answer 1

这是confirmed as a bug，没有解决方法。在修复之前，这似乎是生活中的事实。

Answer 2

这是一个令人头疼的大问题，但是我终于找到了一种解决方法：创建一个iframe，在其中运行音频渲染代码，使用postMessage将结果返回到主窗口，然后立即删除收到结果后，来自DOM的iframe。这样会清除与其相关的所有资源，包括offlineAudioContext。

当然，只有在您的用例是执行相对少量的相对较长的渲染时，这才是实际的。

请注意，要高效传输数据，您应该发送ArrayBuffer个对象，它们是Transferable：

context.oncomplete = function (e) {
  var channels = [];
  for (var c = 0; c < e.renderedBuffer.numberOfChannels; c++) {
    channels.push(e.renderedBuffer.getChannelData(c));
  }
  channels = channels.map( function(c) {return c.buffer;} );
  window.parent.postMessage({
    action:'renderResult',
    data: channels
  }, "*", channels);
}

并在接收端从它们重新创建Float32Arrays。

如何使浏览器释放OfflineAudioContext使用的内存？

2 个答案: