How to prevent Chromium MediaSource buffer eviction from dropping active WebGL textures during stream switches? [migrated]

I am developing a custom WebGL-accelerated media viewer in Vanilla JS using HLS.js (MediaSource API). When switching between multiple live video streams on a single-page layout, memory usage steadily increases despite destroying the previous HLS instance.

In Chrome DevTools memory profiling, I noticed that SourceBuffer memory is retained until full garbage collection triggers, but manually evicting ranges (SourceBuffer.remove(0, Infinity)) before detaching media causes WebGL frame rendering drops on lower-end GPU hardware.

My current cleanup pipeline looks like this:

function switchStream(hlsInstance, videoEl) {
    if (hlsInstance) {
        hlsInstance.stopLoad();
        hlsInstance.detachMedia();
        hlsInstance.destroy();
    }
    if (videoEl) {
        videoEl.pause();
        videoEl.removeAttribute('src');
        videoEl.load();
    }
}