encyklopedia.space

Media Source Extensions

Media Source Extensions (MSE) – interfejs programistyczny (API) wprowadzony jako część specyfikacji HTML5, umożliwiający dynamiczne tworzenie i kontrolowanie strumieni multimedialnych w przeglądarkach internetowych. Dzięki MSE aplikacje webowe mogą łączyć, buforować i odtwarzać zawartość wideo oraz audio w czasie rzeczywistym, bez konieczności pełnego pobierania pliku źródłowego.

Historia i rozwój

Prace nad Media Source Extensions rozpoczęły się w 2011 roku w ramach grupy roboczej W3C połączonej z projektem WHATWG. Pierwsza wersja specyfikacji została opublikowana w marcu 2012 roku, a pierwsze implementacje pojawiły się w przeglądarkach Google Chrome i Mozilla Firefox tego samego roku. Od tego czasu MSE jest wspierane także w Microsoft Edge, Safari oraz w mobilnych przeglądarkach Android i iOS.

Podstawowe pojęcia

  • MediaSource – obiekt reprezentujący źródło mediów, które może być podłączone do elementu <video> lub <audio>.
  • SourceBuffer – bufor, do którego aplikacja może dopisywać fragmenty danych (tzw. „segmenty”).
  • Mime type – typ zawartości, określający format strumienia (np. video/mp4; codecs="avc1.42E01E, mp4a.40.2").
  • Segment – fragment kodowany w wybranym formacie, który jest dodawany do SourceBuffer w czasie odtwarzania.

Przykładowe zastosowania

MSE znajduje zastosowanie w wielu nowoczesnych rozwiązaniach internetowych:

  1. Strumieniowanie wideo na żądanie (VOD) – serwisy takie jak Netflix czy YouTube wykorzystują MSE do adaptacyjnego przesyłania strumieni Adaptive Bitrate (ABR).
  2. Transmisje na żywo – umożliwiają podział transmisji na krótkie segmenty (np. w formacie MPEG‑DASH lub HLS) i ich dynamiczne dołączanie.
  3. Rekordery przeglądarkowe – aplikacje typu WebRTC mogą zapisywać nagrania w czasie rzeczywistym, korzystając z MSE do odtwarzania zebranego materiału.
  4. Gry i aplikacje WebGL – wykorzystujące synchroniczny dostęp do dźwięku i wideo w ramach środowiska 3D.

Podstawowy schemat działania

Poniżej przedstawiono uproszczony przebieg pracy z Media Source Extensions:

const video = document.querySelector('video');
const mediaSource = new MediaSource();
video.src = URL.createObjectURL(mediaSource);

mediaSource.addEventListener('sourceopen', () => {
    const sourceBuffer = mediaSource.addSourceBuffer('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
    fetchSegment('segment1.mp4').then(data => sourceBuffer.appendBuffer(data));
    // kolejne segmenty można dopisywać w miarę potrzeb
});

Wymagania techniczne i ograniczenia

  • Przeglądarka musi obsługiwać HTML5 oraz posiadać implementację MSE.
  • Segmenty muszą być zgodne z wybranym kodekiem i kontenerem; najczęściej używane są MP4 (z ISO‑BMFF) oraz WebM.
  • W niektórych przeglądarkach istnieją limity rozmiaru bufora (np. 2 GB w Chrome).
  • Obsługa DRM (Digital Rights Management) wymaga dodatkowych interfejsów, takich jak Encrypted Media Extensions (EME).

Powiązane technologie

Media Source Extensions jest ściśle powiązane z innymi standardami webowymi:

Przeglądarki i wsparcie

Przeglądarka Wersja wprowadzająca MSE Stan wsparcia
Google Chrome 14 Pełne
Mozilla Firefox 29 Pełne
Microsoft Edge (Chromium) 79 Pełne
Safari 8 Pełne (od 12.1 w pełni)
Opera 15 Pełne

Przyszłość

Rozwój MSE koncentruje się na zwiększaniu efektywności buforowania, wsparciu dla nowych kodeków (np. AV1) oraz lepszej integracji z technologiami PWA. Wspólne prace nad Web Codecs mogą w przyszłości zredukować potrzebę pośrednich warstw dekodujących, co przyspieszy odtwarzanie i zmniejszy zużycie pamięci.

Bibliografia

  • W3C Recommendation – Media Source Extensions, 2012, Media Source Extensions
  • Specyfikacja HTML Living Standard – sekcja dotycząca MediaSource
  • „Adaptive Streaming over HTTP – A Survey“, autorzy: F. Yin, Z. Ni, 2020.

Artykuł opracowany na podstawie dokumentacji W3C oraz publicznie dostępnych źródeł technicznych.