Web Audio API 中 MediaElementSource 使用的内存是否比 BufferSource 少?

2024-04-05

我正在制作一个小应用程序,它将播放音频文件(mp3、wav),并能够在它们上使用均衡器(例如常规音频播放器),为此我使用 Web Audio Api。

我设法通过两种方式获得戏剧部分。使用解码音频数据 https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/decodeAudioData of 基础音频上下文 https://developer.mozilla.org/en-US/docs/Web/API/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() and 创建媒体元素源() https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createMediaElementSource

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

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

Does createMediaElementSource()使用的内存少于createBufferSource() ?

Edit:使用 Chrome 的任务管理器时看起来就像createBufferSource()仅仅加载文件就会增加内存列大约 40000k,而不是 +/-60kcreateMediaElementSource(),以及 Javascript 内存 1000k 与 20k


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

您需要注意几件事。

  • 使用媒体元素,您将失去样本精确的控制;这对你来说可能不重要
  • 使用时您需要适当的访问权限MediaElementAudioSourceNode;如果您的所有资产都位于同一服务器上,这可能不是问题
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Web Audio API 中 MediaElementSource 使用的内存是否比 BufferSource 少? 的相关文章

随机推荐