Search code examples
javascriptmedia-source

Where does media source buffer data go?

I'm appending video to a source buffer from a live source so potentially there is no limit to the length of the source.

Where is the data in the source buffer going in the browser, is it stored in memory or a disk cache file?

Should I be concerned about how large the buffer will become? Perhaps I should remove some data from the buffer periodically?

I'm not concerned about seeking, I only want to view the live stream.

I ran this code to see whats going on with the buffer

var ranges = sourceBuffer.buffered;
console.log("CURRENT TIME: " + video.currentTime);
console.log("BUFFERED RANGES: " + ranges.length);
for (var i = 0, len = ranges.length; i < len; i += 1) {
  console.log("RANGE: " + ranges.start(i) + " - " + ranges.end(i));
}

Here is a sample output.

CURRENT TIME: 1604.005
BUFFERED RANGES: 2
RANGE: 1 - 1582 
RANGE: 1582 - 1606
Solution

  • No you don't need to worry. The MediaSource will free up space if needed when data is appended to the buffer. See the specification.

    You can verify this by running chrome developer tools and record the memory in the timeline tab. Don't worry if it seems that not all memory is returned, it will eventually.