SourceBuffer

The SourceBuffer interface represents a chunk of media to be passed into an HTMLMediaElement and played, via a MediaSource object. This can be made up of one or several media segments.

Properties

SourceBuffer.appendWindowEnd
Controls the timestamp for the end of the append window.
SourceBuffer.appendWindowStart
Controls the timestamp for the start of the append window. This is a timestamp range that can be used to filter what media data is appended to the SourceBuffer. Coded media frames with timestamps within this range will be appended, whereas those outside the range will be filtered out.
SourceBuffer.audioTracks Read only
A list of the audio tracks currently contained inside the SourceBuffer.
SourceBuffer.buffered Read only
Returns the time ranges that are currently buffered in the SourceBuffer.
SourceBuffer.mode
Controls how the order of media segments in the SourceBuffer is handled, in terms of whether they can be appended in any order, or they have to be kept in a strict sequence.
SourceBuffer.textTracks Read only
A list of the text tracks currently contained inside the SourceBuffer.
SourceBuffer.timestampOffset
Controls the offset applied to timestamps inside media segments that are subsequently appended to the SourceBuffer.
SourceBuffer.trackDefaults
Specifies the default values to use if kind, label, and/or language information is not available in the initialization segment of the media to be appended to the SourceBuffer.
SourceBuffer.updating Read only
A boolean indicating whether the SourceBuffer is currently being updated — i.e. whether an SourceBuffer.appendBuffer(), SourceBuffer.appendStream(), or SourceBuffer.remove() operation is currently in progress.
SourceBuffer.videoTracks Read only
A list of the video tracks currently contained inside the SourceBuffer.

Event handlers

SourceBuffer.onabort
Fired whenever SourceBuffer.appendBuffer() or SourceBuffer.appendStream() is ended by a call to SourceBuffer.abort()SourceBuffer.updating changes from true to false.
SourceBuffer.onerror
Fired whenever an error occurs during SourceBuffer.appendBuffer() or SourceBuffer.appendStream()SourceBuffer.updating changes from true to false.
SourceBuffer.onupdate
Fired whenever SourceBuffer.appendBuffer() method or the SourceBuffer.remove() completes. SourceBuffer.updating changes from true to false. This event is fired before onupdateend.
SourceBuffer.onupdateend
Fired whenever SourceBuffer.appendBuffer() method or the SourceBuffer.remove() has ended. This event is fired after onupdate.
SourceBuffer.onupdatestart
Fired whenever the value of SourceBuffer.updating transitions from false to true.

Methods

Inherits methods from its parent interface, EventTarget.

SourceBuffer.abort()
Aborts the current segment and resets the segment parser.
SourceBuffer.appendBuffer()
Appends media segment data from an ArrayBuffer or ArrayBufferView object to the SourceBuffer.
SourceBuffer.appendBufferAsync()
Starts the process of asynchronously appending the specified buffer to the SourceBuffer. Returns a Promise which is fulfilled once the buffer has been appended.
SourceBuffer.appendStream()
Appends media segment data from a ReadableStream object to the SourceBuffer.
SourceBuffer.changeType()
Changes the MIME type that future calls to appendBuffer() will expect the new data to conform to.
SourceBuffer.remove()
Removes media segments within a specific time range from the SourceBuffer.
SourceBuffer.removeAsync()
Starts the process of asynchronously removing media segments in the specified range from the SourceBuffer. Returns a Promise which is fulfilled once all matching segments have been removed.

Examples

The following simple example loads a video chunk by chunk as fast as possible, playing it as soon as it can. This example was written by Nick Desaulniers and can be viewed live here (you can also download the source for further investigation.)

var video = document.querySelector('video');

var assetURL = 'frag_bunny.mp4';
// Need to be specific for Blink regarding codecs
// ./mp4info frag_bunny.mp4 | grep Codec
var mimeCodec = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"';

if ('MediaSource' in window && MediaSource.isTypeSupported(mimeCodec)) {
  var mediaSource = new MediaSource;
  //console.log(mediaSource.readyState); // closed
  video.src = URL.createObjectURL(mediaSource);
  mediaSource.addEventListener('sourceopen', sourceOpen);
} else {
  console.error('Unsupported MIME type or codec: ', mimeCodec);
}

function sourceOpen (_) {
  //console.log(this.readyState); // open
  var mediaSource = this;
  var sourceBuffer = mediaSource.addSourceBuffer(mimeCodec);
  fetchAB(assetURL, function (buf) {
    sourceBuffer.addEventListener('updateend', function (_) {
      mediaSource.endOfStream();
      video.play();
      //console.log(mediaSource.readyState); // ended
    });
    sourceBuffer.appendBuffer(buf);
  });
}

function fetchAB (url, cb) {
  console.log(url);
  var xhr = new XMLHttpRequest;
  xhr.open('get', url);
  xhr.responseType = 'arraybuffer';
  xhr.onload = function () {
    cb(xhr.response);
  };
  xhr.send();
}

Specifications

Specification Status Comment
Media Source Extensions
The definition of 'SourceBuffer' in that specification.
Recommendation Initial definition.

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Basic supportChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support YesFirefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
modeChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
updatingChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
bufferedChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
changeTypeChrome Full support 70
Full support 70
No support 69 — 70
Disabled
Disabled From version 69 until version 70 (exclusive): this feature is behind the MediaSourceExperimental preference (needs to be set to true). To change preferences in Chrome, visit chrome://flags.
Edge No support NoFirefox Full support 63
Full support 63
No support 61 — 63
Disabled
Disabled From version 61 until version 63 (exclusive): this feature is behind the media.mediasource.experimental.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE ? Opera ? Safari ? WebView Android ? Chrome Android Full support 70
Full support 70
No support 69 — 70
Disabled
Disabled From version 69 until version 70 (exclusive): this feature is behind the MediaSourceExperimental preference (needs to be set to true). To change preferences in Chrome, visit chrome://flags.
Edge Mobile No support NoFirefox Android Full support 63
Full support 63
No support 61 — 63
Disabled
Disabled From version 61 until version 63 (exclusive): this feature is behind the media.mediasource.experimental.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android ? Safari iOS ? Samsung Internet Android ?
timestampOffsetChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
audioTracksChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
videoTracksChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
textTracksChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support YesFirefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
appendWindowStartChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
appendWindowEndChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
trackDefaultsChrome ? Edge ? Firefox No support NoIE ? Opera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile ? Firefox Android No support NoOpera Android ? Safari iOS No support NoSamsung Internet Android ?
onabortChrome Full support 53Edge Full support 17Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support 17Firefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
onerrorChrome Full support 53Edge Full support 17Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support 17Firefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
onupdateChrome Full support 53Edge Full support 17Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support 17Firefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
onupdatestartChrome Full support 53Edge Full support 17Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support 17Firefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
onupdateendChrome Full support 53Edge Full support 17Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support 17Firefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
appendBufferChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
appendBufferAsyncChrome No support NoEdge No support NoFirefox Full support 62
Disabled
Full support 62
Disabled
Disabled From version 62: this feature is behind the media.mediasource.experimental.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android Full support YesEdge Mobile No support NoFirefox Android Full support 62
Disabled
Full support 62
Disabled
Disabled From version 62: this feature is behind the media.mediasource.experimental.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android No support NoSafari iOS No support NoSamsung Internet Android ?
appendStreamChrome No support NoEdge Full support 12Firefox No support NoIE ? Opera No support NoSafari ? WebView Android ? Chrome Android ? Edge Mobile ? Firefox Android No support NoOpera Android ? Safari iOS No support NoSamsung Internet Android ?
abortChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
removeChrome Full support 31
Full support 31
No support 23 — 31
Prefixed
Prefixed Requires the vendor prefix: -webkit-
Edge Full support 12Firefox Full support 42
Full support 42
No support 25 — 42
Notes Disabled
Notes Limited support to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed when Media Source Extensions was enabled by default in Firefox 42.
Disabled From version 25 until version 42 (exclusive): this feature is behind the media.mediasource.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE Full support 11
Notes
Full support 11
Notes
Notes Only works on Windows 8+.
Opera Full support 15Safari Full support 8WebView Android Full support 4.4.3Chrome Android ? Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 30Safari iOS No support NoSamsung Internet Android ?
removeAsyncChrome No support NoEdge No support NoFirefox Full support 62
Disabled
Full support 62
Disabled
Disabled From version 62: this feature is behind the media.mediasource.experimental.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android Full support YesEdge Mobile No support NoFirefox Android Full support 62
Disabled
Full support 62
Disabled
Disabled From version 62: this feature is behind the media.mediasource.experimental.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android No support NoSafari iOS No support NoSamsung Internet Android ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.
User must explicitly enable this feature.
User must explicitly enable this feature.
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.

See also

Document Tags and Contributors

Last updated by: Sheppy,