coderef

Media sourceLimited availability

The MediaSource API is a custom data source for media elements commonly used for adaptive streaming. Also known as Media Source Extensions (MSE).

Not yet supported in all major browsers — check the table and provide a fallback.

How to use ↓Compare browsers

Browser support

DesktopChrome
1–30Not supported
31+Supportedsince Nov 12, 2013
Current: 155
Edge
12+Supportedsince Jul 29, 2015
Current: 154
Firefox
1–41Not supported
42+Supportedsince Nov 3, 2015
Current: 157
Safari
1–7Not supported
8+Supportedsince Oct 16, 2014
Current: 27
MobileChrome Android
18–30Not supported
31+Supportedsince Nov 14, 2013
Current: 155
Firefox Android
4–40Not supported
41+Supportedsince Sep 22, 2015
Current: 157
Safari iOS
✕Not supportedup to 27
Current: 27

How to use

Not supported in Safari iOS. Use feature detection below and provide a fallback (or a polyfill) for those browsers.

Example

Full syntax and examples are on MDN: sourceBuffer.

Feature detection

JS · check before using
if ("MediaSource" in globalThis) {
  // MediaSource is available
} else {
  // load a polyfill or use a fallback
}

Documentation (MDN)

Specification

Usage share

Sub-features

Support for each part of the feature (70). The overall table above shows when the whole feature works.

Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
AudioTrack.sourceBuffer✕✕✕8✕✕✕
BufferedChangeEvent✕✕✕17✕✕17.1
BufferedChangeEvent.BufferedChangeEvent✕✕✕17✕✕17.1
BufferedChangeEvent.addedRanges✕✕✕17✕✕17.1
BufferedChangeEvent.removedRanges✕✕✕17✕✕17.1
HTMLMediaElement.srcObject✕✕✕11✕✕11
MediaSource31124283141✕
MediaSource.MediaSource31124283341✕
MediaSource.activeSourceBuffers31124283141✕
MediaSource.addSourceBuffer31124283141✕
MediaSource.canConstructInDedicatedWorker_static108108✕18108✕✕
MediaSource.clearLiveSeekableRange62175010.16250✕
MediaSource.duration31124283141✕
MediaSource.endOfStream31124283141✕
MediaSource.handle108108✕18108✕✕
MediaSource.isTypeSupported_static31124283141✕
MediaSource.readyState31124283341✕
MediaSource.removeSourceBuffer31124283141✕
MediaSource.setLiveSeekableRange62175010.16250✕
MediaSource.sourceBuffers31124283141✕
Show 50 more
Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
MediaSource.sourceclose_event53178710.15387✕
MediaSource.sourceended_event53174210.15341✕
MediaSource.sourceopen_event53174210.15341✕
MediaSource.worker_support108108✕✕108✕✕
MediaSourceHandle108108✕18108✕18
SourceBuffer31124283142✕
SourceBuffer.abort31124283142✕
SourceBuffer.abort.worker_support108108✕✕108✕✕
SourceBuffer.abort_event53174210.15342✕
SourceBuffer.abort_event.worker_support108108✕✕108✕✕
SourceBuffer.appendBuffer31124283342✕
SourceBuffer.appendBuffer.worker_support108108✕✕108✕✕
SourceBuffer.appendWindowEnd31124283342✕
SourceBuffer.appendWindowEnd.worker_support108108✕✕108✕✕
SourceBuffer.appendWindowStart31124283342✕
SourceBuffer.appendWindowStart.worker_support108108✕✕108✕✕
SourceBuffer.audioTracks✕✕✕8✕✕✕
SourceBuffer.audioTracks.worker_support✕✕✕✕✕✕✕
SourceBuffer.buffered31124283342✕
SourceBuffer.buffered.worker_support108108✕✕108✕✕
SourceBuffer.changeType70796312.17063✕
SourceBuffer.changeType.worker_support108108✕✕108✕✕
SourceBuffer.error_event53174210.15342✕
SourceBuffer.error_event.worker_support108108✕✕108✕✕
SourceBuffer.mode31124283342✕
SourceBuffer.mode.worker_support108108✕✕108✕✕
SourceBuffer.remove31124283342✕
SourceBuffer.remove.worker_support108108✕✕108✕✕
SourceBuffer.textTracks✕✕✕8✕✕✕
SourceBuffer.timestampOffset31124283342✕
SourceBuffer.timestampOffset.worker_support108108✕✕108✕✕
SourceBuffer.update_event53174210.15342✕
SourceBuffer.update_event.worker_support108108✕✕108✕✕
SourceBuffer.updateend_event53174210.15342✕
SourceBuffer.updateend_event.worker_support108108✕✕108✕✕
SourceBuffer.updatestart_event53174210.15342✕
SourceBuffer.updatestart_event.worker_support108108✕✕108✕✕
SourceBuffer.updating31124283342✕
SourceBuffer.updating.worker_support108108✕✕108✕✕
SourceBuffer.videoTracks✕✕✕8✕✕✕
SourceBuffer.videoTracks.worker_support✕✕✕✕✕✕✕
SourceBufferList31124283141✕
SourceBufferList.addsourcebuffer_event53174210.15341✕
SourceBufferList.addsourcebuffer_event.worker_support108108✕✕108✕✕
SourceBufferList.length31124283341✕
SourceBufferList.length.worker_support108108✕✕108✕✕
SourceBufferList.removesourcebuffer_event53174210.15341✕
SourceBufferList.removesourcebuffer_event.worker_support108108✕✕108✕✕
TextTrack.sourceBuffer✕✕✕8✕✕✕
VideoTrack.sourceBuffer✕✕✕7✕✕✕