GitHub/hls.js
1
0
Fork 0
mirror of https://github.com/video-dev/hls.js.git synced 2026-05-17 13:30:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update README Alternative setup for 2026 browsers (#7844)

Browse Source 
Closes #7827
This commit is contained in:
Rob Walch
2026-05-15 16:33:20 -07:00
committed by GitHub
parent 9340b95cc3
commit c3704408ac
1 changed files with 11 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+11 -4
View File
@@ -367,7 +367,9 @@ native browser support for HLS playback in HTMLMediaElements:
#### Alternative setup
To check for native browser support first and then fallback to HLS.js, swap these conditionals. See [this comment](https://github.com/video-dev/hls.js/pull/2954#issuecomment-670021358) to understand some of the tradeoffs.
To check for native browser support first and then fallback to HLS.js, swap these conditionals.
> **Note:** `video.canPlayType('application/vnd.apple.mpegurl')` returns a non-empty string ("maybe") in Safari, Chrome, and potentially other browsers. However, not all browsers support HLS content equally — for example, Chrome 147 reports support but may fail to play certain streams natively. Using `Hls.isSupported()` first (the default setup above) is recommended unless you specifically need native playback.
```html
<script src="https://cdn.jsdelivr.net/npm/hls.js@1"></script>
@@ -378,12 +380,17 @@ To check for native browser support first and then fallback to HLS.js, swap thes
var video = document.getElementById('video');
var videoSrc = 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8';
//
// First check for native browser HLS support
// Only use native HLS in browsers with ManagedMediaSource (e.g. modern Safari)
// where native playback is well-supported. Other browsers may report HLS support
// via canPlayType but fail to play certain streams reliably.
//
if (video.canPlayType('application/vnd.apple.mpegurl')) {
if (
video.canPlayType('application/vnd.apple.mpegurl') &&
'ManagedMediaSource' in window
) {
video.src = videoSrc;
//
// If no native HLS support, check if HLS.js is supported
// If not using native HLS, check if HLS.js is supported
//
} else if (Hls.isSupported()) {
var hls = new Hls();