Estoy desarrollando un juego usando javascript y otras tecnologías web. En él, hay un modo de juego que es básicamente una defensa de la torre, en el que varios objetos pueden necesitar hacer uso del mismo archivo de audio (.ogg) al mismo tiempo. Cargar un archivo y crear un nuevo webaudio para cada uno de ellos se retrasa demasiado, incluso si intento transmitirlo en lugar de una simple lectura sincronizada, y si creo y guardo un webaudio en una variable para usarlo varias veces, cada vez se está reproduciendo y hay una nueva solicitud para reproducir dicho audio, el que se estaba reproduciendo se detendrá para permitir que se reproduzca el nuevo (entonces, con suficientes de esos, no se reproduce nada en absoluto).
Con esos problemas, decidí hacer copias de dicho objeto webaudio cada vez que se iba a reproducir, pero no solo es lento hacerlo, sino que también crea una fuga de memoria menor (al menos de la forma en que lo hice).
¿Cómo puedo almacenar en caché correctamente un webaudio para su reutilización? Considere que estoy bastante seguro de que necesitaré uno nuevo cada vez porque cada audio tiene una posición y, por lo tanto, cada uno de ellos se reproducirá de manera diferente, según la posición del reproductor en relación con el objeto que está reproduciendo el audio.
Etiquetó su pregunta con web-audio-api, pero a partir del cuerpo de esta pregunta, parece que está usando HTMLMediaElement <audio> en lugar de Web Audio API .
Así que los invitaré a hacer la transición a esa API de audio web.
A partir de ahí, podrá decodificar una vez su archivo de audio, mantener solo una vez los datos decodificados como un AudioBuffer y crear muchos lectores que se conectarán a ese único AudioBuffer, sin consumir más memoria.
const btn = document.querySelector("button") const context = new AudioContext(); // a GainNode to control the output volume of our audio const volumeNode = context.createGain(); volumeNode.gain.value = 0.5; // from 0 to 1 volumeNode.connect(context.destination); fetch("https://dl.dropboxusercontent.com/s/agepbh2agnduknz/camera.mp3") // get the resource as an ArrayBuffer .then((resp) => resp.arrayBuffer()) // decode the Audio data from this resource .then((buffer) => context.decodeAudioData(buffer)) // now we have our AudioBuffer object, ready to be played .then((audioBuffer) => { btn.onclick = (evt) => { // allowing an AudioContext to make noise // must be required from an user-gesture if (context.status === "suspended") { context.resume(); } // a very light player object const source = context.createBufferSource(); // a simple pointer to the big AudioBuffer (no copy) source.buffer = audioBuffer; // connect to our volume node, itself connected to audio output source.connect(volumeNode); // start playing now source.start(0); }; // now you can spam the button! btn.disabled = false; }) .catch(console.error); <button disabled>play</button>