-
Notifications
You must be signed in to change notification settings - Fork 2.7k
Description
What version of Hls.js are you using?
v.1.6.5
What browser (including version) are you using?
Chrome 137.0.7151.104 (Offical Build) (64bit)
What OS (including version) are you using?
Windows 10, Widows 11
Test stream
If needed for analysis, we’re happy to provide a Docker-based test environment that can reproduce the issue in a local network.
Configuration
{
"debug": true,
"enableWorker": true,
"lowLatencyMode": true,
"backBufferLength": 90
}
Additional player setup steps
No response
Checklist
- The issue observed is not already reported by searching on Github under https://github.com/video-dev/hls.js/issues
- The issue occurs in the stable client (latest release) on https://hlsjs.video-dev.org/demo and not just on my page
- The issue occurs in the latest client (main branch) on https://hlsjs-dev.video-dev.org/demo and not just on my page
- The stream has correct Access-Control-Allow-Origin headers (CORS)
- There are no network errors such as 404s in the browser console when trying to play the stream
Steps to reproduce
- Set up a Low-Latency HLS streaming server (e.g., OvenMediaEngine) in a local network. Because the local network is extremely fast, the issue can be reproduced 100% of the time.
- Publish a live stream to the streaming server using encoder like OBS.
- Open the hls.js 1.6.5 demo page and play the stream from the streaming server.
- During playback, frequent
bufferAppendError
errors occur, causing the video to momentarily freeze.
Expected behaviour
Playback should proceed smoothly without any bufferAppendError
errors or stalls, just like it does with hls.js v1.5.x and iOS safari.
What actually happened?
Issue Overview
This issue occurs only when playing LL-HLS streams using hls.js v1.6.x in extremely fast network environments.
Reproduction Based on Network Conditions
To verify that this issue only occurs in fast networks, I tested with hls.js v1.6.5 in various network environments. The results are as follows:
-
Streaming server in a local network / playback in same local network
bufferAppendError
occurs
-
Streaming server in a local network / playback in same network with Chrome DevTools throttling (simulating fast 4G)
bufferAppendError
does not occur
-
Streaming server in EC2 (Seoul) / playback in Seoul
bufferAppendError
occurs
-
Streaming server in EC2 (California) / playback in Seoul
bufferAppendError
does not occur
Note: Under the same network conditions and using the same stream, this issue does not occur with hls.js v1.5.20 or iOS Safari's native player.
Issue Description
The following symptoms are observed when this issue occurs.
- Partial segments are downloaded extremely quickly.
- Within a few seconds to a couple of minutes after playback starts,
bufferAppendError
begins to occur repeatedly.- 2.1 Playback temporarily freezes when the error occurs.
- 2.2 hls.js may switch from loading partial segments to loading full segments.
- 2.3 Error event logs show the following information:
error.details: "bufferAppendError"
error.sourceBufferName: "video"
error.type: "mediaError"
error.stack:
InvalidStateError: Failed to execute 'appendBuffer' on 'SourceBuffer': This SourceBuffer is still processing an 'appendBuffer' or 'remove' operation.
at BufferController.appendExecutor (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:19965:10)
at Object.execute (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:19331:19)
at BufferOperationQueue.executeNext (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:18574:21)
at BufferOperationQueue.append (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:18511:14)
at BufferController.append (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:20048:29)
at BufferController.onBufferAppending (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:19409:12)
at EventEmitter.emit (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:372:37)
at Hls.emit (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:35599:28)
at Hls.trigger (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:35603:21)
at StreamController.bufferFragmentData (https://7127ae6b.hls-js-dev.pages.dev/dist/hls.js:9862:16)
error.code: 11
error.name: "InvalidStateError"
Additional Analysis of Buffer Append Failures
When bufferAppendError
occurs, I observe the following exception:
Failed to execute 'appendBuffer' on 'SourceBuffer': This SourceBuffer is still processing an 'appendBuffer' or 'remove' operation.
From this, I suspect that in very fast network environments, partial segments are being downloaded and appended to the buffer too rapidly.
Under certain conditions, this leads to a race condition, which causes appendBuffer
to fail.
As a result of this failure, there is no buffered data available for playback, which seems to cause the playback to temporarily freeze.
In Chrome's chrome://media-internals
, I can see some "DEMUXER_UNDERFLOW" logs:
{
"time": 23170.012000001967,
"key": "video_buffering_state",
"value": {
"reason": "DEMUXER_UNDERFLOW",
"state": "BUFFERING_HAVE_NOTHING"
}
}
Additionally to determine if this is related to how hls.js uses Web Workers for buffer management, I tested with "enableWorker": false
.
- With
"enableWorker": true
,bufferAppendError
occurs almost 100% of the time, repeatedly during playback. - With
"enableWorker": false
, the error only occurs sporadically during long playback sessions, and does not seem to repeat continuously.
Conclusion
I wonder if this issue might be related to the changes introduced in v1.6.0, specifically the update on "Improved stall detection and buffer gap handling".
Could this behavior be a side effect of those changes?
Or is it possibly caused by another underlying problem?
I would greatly appreciate any insights or guidance from the hls.js community regarding whether this is a known regression or an unintended consequence of recent improvements.