I'm dynamically generating multiple ~2mb files and downloading them in sequence for an internal application. The code works but when it reaches about 55 images the page stops and gives me a "status breakpoint" error.

I went to the memory tab in the chrome devtools and saw that at every loop the memory footprint increases, so I believe the blobs being generated are not being disposed for some reason.. here's my code:

  capturer.save(blob => {
    // const link = document.createElement("a");
    let downloadURL = URL.createObjectURL(blob);
    downloader.href = downloadURL;
    downloader.download = currentImage + ".gif";
    downloader.dispatchEvent(new MouseEvent("click"));

    URL.revokeObjectURL(downloadURL);
    URL.revokeObjectURL(blob);
    // tried these, no effect

    if (startImage< endImage) {
      setTimeout(() => {
        this.imageExport(++startImage, endImage);
      }, 0);
    }
  });

As you can see, I was initially creating elements dynamically but then I commented it out and added a single downloader element to test, didn't work. I believe the blobs are piling up on the memory and I can't find a way to dispose them.

Any ideas? I've been trying to fix this for hours now.