There are videos where buffer stalls always occur.

[sgbai78]

What do you want to do with Hls.js?

I am working on a code to play hls using flutter.
I'm using exoplayer on android, but the problem is occurring only on the web version.

The web version uses hls.js, but buffering always occurs for some videos.

When I check such videos on the demo page, there are parts that seem to be cut off in the media buffer and video buffer parts.

Can you explain to me what these cut outs mean?

And can I play the video naturally without buffering like this by changing the options in hls.js?

this is a test video.
http://61.74.215.10:8888/streaming/ql1Yuxbop1yr5WYNDbmiLJSAVAxCXlBzwz2MXg2pvm9wcN343G9c4OD3X8M5kpx8/hls.m3u8

What have you tried so far?

I tried changing lowLatencyMode to false or increasing backBufferLength, but to no avail.

[robwalch]

Hi @sgbai78,

Can you please share the console logs from one of the sessions using the media.

The gap is likely an issue with alignment of video timestamps between to quality on start, and the quality playback switches up to.

You could try setting startLevel to the highest levels index to avoid adaptive switch up for most sessions to avoid the gap.

[sgbai78]

Your answer helped me a lot.

After looking at the answer, I confirmed that the duration is different between m3u8 files.

This is the file for 360p

#EXTM3U
#EXT-X-VERSION:6
#EXT-X-TARGETDURATION:8
#EXT-X-PLAYLIST-TYPE:VOD
#EXT-X-MAP:URI="video_360p_365k_h264_init.mp4"
#EXTINF:8.000,
video_360p_365k_h264_1.mp4
#EXTINF:8.000,
video_360p_365k_h264_2.mp4
#EXTINF:8.000,

This is a 720p file.
#EXTM3U
#EXT-X-VERSION:6
#EXT-X-TARGETDURATION:8
#EXT-X-PLAYLIST-TYPE:VOD
#EXT-X-MAP:URI="video_720p_4.5M_h264_init.mp4"
#EXTINF:4.000,
video_720p_4.5M_h264_1.mp4
#EXTINF:4.000,
video_720p_4.5M_h264_2.mp4
#EXTINF:4.000,
video_720p_4.5M_h264_3.mp4

The problem seems to be caused by the 720p file being cut off at 4 seconds.

It's a little disappointing that this problem has not occurred on other platforms.

However, I believe this is an encoding issue, so let's take a look at the environment on the encoder side again.

[robwalch]

Funny that the 60fps variant has 4 seconds segments while the 30fps variants have 8 second durations (but they both have been given a target duration of 8). If the keyframes/GoPs align between these segments it shouldn't be an issue to overwrite the second half of the 30fps content with 60fps content, but MSE in Chrome doesn' t seem to go for that. Maybe we can look into deferring the switch until the 8 second segment boundary in a future release.

[bes]

Hello @sgbai78 I'm trying to convince Chrome to fix this issue. Do you have a source where I can download the video to build a proof of concept? Thanks!

[sgbai78]

@bes

hello.

The capacity is too large to upload.

So I'll post a test link.

http://118.45.188.177:18003/streaming/ql1Yuxbop1yr5WYNDbmiLJSAVAxCXlBzwz2MXg2pvm9wcN343G9c4OD3X8M5kpx8/hls.m3u8

and this is the download link.

http://118.45.188.177:18003/streaming/ql1Yuxbop1yr5WYNDbmiLJSAVAxCXlBzwz2MXg2pvm9wcN343G9c4OD3X8M5kpx8/file.zip

Thank you.

[bes]

@sgbai78 thank you, I have downloaded the zip 👍

[robwalch]

Hi @sgbai78,

Please let me know if the changes in #5804 fix this issue or at least improve playback performance for you.

https://bugfix-chrome-avc-overlap-fm.hls-js-4zn.pages.dev/demo/

[sgbai78]

@robwalch

I just tested it and it works fine.
Thank you.