Creating multiple waveforms and memory leaking

Hi, I have a question

I am creating multiple waveforms and it works well by creating one instance and using MediaElement (thanks for people who helped it out #1005)

But I found that there’s memory leaking

Got this from Chrome Timeline and apparently it happens when it calls XHRhttpRequest

And this from Chrome profile

here’s the code from wavesurfer.js

 ajax: function (options) {
        ...
        var xhr = new XMLHttpRequest();
        xhr.open(options.method || 'GET', options.url, true);
        xhr.responseType = options.responseType || 'json';
        ...
    }

what I don’t understand is this ajax function calls an audio file (ex. http://localhost/audio/sample.mp3) and my understanding of ajax call is usually some code file.

So my question is

1. why ajax function calls an audio file.
2. the way how to prevent memory leaking or to free used memory

Browser version(s):

Chrome Version 56.0.2924.87 (64-bit)

[mspae]

1. Ajax (aka XMLHttpRequest) can be used to fetch all kinds of files. Wavesurfer loads audio with Ajax if 1. Backend Web Audio is used or 2. Peaks are not provided
2. There are several memory leaks which are currently being fixed for version 2 - the one you experience is probably due to this.arraybuffer not being nullified in destroy.

[rejochandran]

Hi @DOOGIE-CHOE ,

Thanks for the note and I tried this and still got this issue. Some of my findings,

1. The issue mostly occurs in Chrome as it does not clear the memory when a wavesurfer instance is destroyed and opening another instance just adds with to the existing memory and hence mounts up
2. The issue seems to be only with WebAudio as backend but I have no other choice as my application requires the user to navigate back and forth to analyze the audio.

Most of the issues are part of #1940 , So hopefully we get this resolved 🙂 and thanks again for your quick response