Media Source Extensions（MSE）：自适应流与缓冲管理

概述MSE 允许在浏览器中动态向媒体元素附加字节流，适用于 DASH/HLS 等分片播放与码率切换。核心对象包括 `MediaSource` 与 `SourceBuffer`。用法/示例const video = document.querySelector('video') const ms = new MediaSource() video.src = URL.createObjectURL(ms) ms.addEventListener('sourceopen', async () => { const sb = ms.addSourceBuffer('video/webm; codecs="vp09.00.10.08"') const chunk = await fetch('/seg-000.webm').then(r => r.arrayBuffer()) sb.appendBuffer(chunk) sb.addEventListener('updateend', () => { ms.duration = video.buffered.end(video.buffered.length - 1) }) }) 工程建议控制缓冲区大小与清理策略（`remove`），防止内存膨胀；处理 `QuotaExceededError`。在码率切换时避免频繁来回震荡；依据网络与解码能力做决策。校验容器与编解码兼容矩阵；对不支持环境回退普通播放。参考与验证MDN：Media Source Extensions — https://developer.mozilla.org/docs/Web/API/Media_Source_Extensions_APIW3C：MSE — https://www.w3.org/TR/media-source/