MediaElementSource 使用的内存是否比 Web Audio API 中的 BufferSource 少？答案

【问题标题】：Does MediaElementSource uses less memory than BufferSource in Web Audio API?MediaElementSource 使用的内存是否比 Web Audio API 中的 BufferSource 少？
【发布时间】：2018-01-24 00:32:49
【问题描述】：

我正在制作一个小应用程序，它可以播放音频文件（mp3、wav），并能够在它们上使用均衡器（比如普通的音频播放器），为此我正在使用 Web Audio Api。

我设法通过两种方式参与其中。使用decodeAudioData 的BaseAudioContext

function getData() {
  source = audioCtx.createBufferSource();
  var request = new XMLHttpRequest();

  request.open('GET', 'viper.ogg', true);

  request.responseType = 'arraybuffer';


  request.onload = function() {
    var audioData = request.response;

    audioCtx.decodeAudioData(audioData, function(buffer) {
        source.buffer = buffer;

        source.connect(audioCtx.destination);
        source.loop = true;
      },

      function(e){ console.log("Error with decoding audio data" + e.err); });

  }

  request.send();
}

// wire up buttons to stop and play audio

play.onclick = function() {
  getData();
  source.start(0);
  play.setAttribute('disabled', 'disabled');
}

使用Audio() 和createMediaElementSource() 更简单

let audioContainer = new Audio('assets/mp3/pink_noise.wav');
let _sourceNodes = _AudioContext.createMediaElementSource(_audioContainer);
_sourceNodes.connect(_AudioContext.destination);
_audioContainer.play();

我认为第二个使用的内存比createBufferSource() 少，因为createBufferSource() 将完整的音频文件存储在内存中。但我不确定这一点，我真的没有太多使用 Chrome Dev 工具等工具的经验来正确阅读它。

createMediaElementSource() 使用的内存是否比 createBufferSource() 少？

编辑： 使用 Chrome 的任务管理器似乎在使用 createBufferSource() 时仅加载文件会增加大约 40000k 的内存列，而 createMediaElementSource() 的 +/-60k 和 Javascript 内存 1000k 与 20k

【问题讨论】：

标签： javascript web-audio-api

【解决方案1】：

我想你已经在任务管理器中找到了答案。

您需要注意几件事。

使用媒体元素，您将失去样本精确控制；这对你来说可能并不重要
使用MediaElementAudioSourceNode 时需要适当的访问权限；如果您的所有资产都在同一台服务器上，这可能不是问题

【讨论】：

我最终将使用BiquadFilter 和DynamicsCompressor。我不认为它需要样品控制，不是吗？我还想最终尝试使用来自 Soundcloud 或 Youtube 等提供商的外部 API。我知道您可以将 Soundcloud 音轨插入 Web Audio Api...不确定 Youtube。
不知道您的用例实际上是什么，但听起来您不需要为您的源提供样本精确的启动和停止。
不过，您也需要适当的 XMLHTTPRequest 访问权限，所以这并没有什么不同。