When I start my server and stream from OBS, the video loads ~10 sec backwards. about hls.js

[robwalch]

The amount of holdback from the live-edge is based on the HLS Playlist and/or configuration settings such as liveSyncDurationCount.

Please share browser dev console logs and a sample of the HLS playlist(s) produced by your streaming server.

[franticboDev]

There is nothing on my browser dev console logs. Also i'm not sure what you meant when you said to share a sample of my HLS playlist. I'm streaming from OBS to a nginx server. Do you mean a .ts file or .m3u8?

[robwalch]

HLS Playlists are m3u8 files.

To enable logging, pass the debug flag at setup: new Hls({ debug: true }).

[franticboDev]

Here is my link to the repo: https://github.com/franticboDev/aa.
I'm going to put that in and tell what it says.

[franticboDev]

[log] > Debug logs enabled for "Hls instance" in hls.js version 1.5.8
hls.js@1:1 [log] > stopLoad
hls.js@1:1 [log] > loadSource:http://....:80/hls/stream1.m3u8
hls.js@1:1 [log] > [stream-controller]: Trigger BUFFER_RESET
hls.js@1:1 [log] > attachMedia
hls.js@1:1 [log] > [buffer-controller] created media source: MediaSource
hls.js@1:1 [log] > [level-controller]: manifest loaded, 1 level(s) found, first bitrate: 0
hls.js@1:1 [log] > [buffer-controller] 1 bufferCodec event(s) expected
hls.js@1:1 [log] > startLoad(-1)
hls.js@1:1 [log] > [level-controller]: Switching to level 0 (SDR @0) from level -1
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [stream-controller]: STOPPED->IDLE
hls.js@1:1 [log] > [subtitle-stream-controller]: STOPPED->IDLE
hls.js@1:1 [log] > [level-controller]: live playlist 0 MISSED
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 1999 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,0], cc [1, 1] duration:4.166
hls.js@1:1 [log] > [stream-controller]: Live playlist sliding: 0.00 start-sn: 0->0 prev-sn: na fragments: 1
hls.js@1:1 [log] > [buffer-controller] Media source opened
hls.js@1:1 [log] > [buffer-controller] Updating Media Source duration to 4.166
hls.js@1:1 [log] > [level-controller]: live playlist 0 MISSED
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 1974 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,0], cc [1, 1] duration:4.166
hls.js@1:1 [log] > [stream-controller]: Live playlist sliding: 0.00 start-sn: 0->0 prev-sn: na fragments: 1
hls.js@1:1 [log] > [stream-controller]: Loading fragment 0 cc: 1 of [0-0] level: 0, target: 0
hls.js@1:1 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls.js@1:1 [log] > injecting Web Worker for "main"
hls.js@1:1 [log] > [transmuxer-interface, main]: Starting new transmux session for sn: 0 p: -1 level: 0 id: 1
discontinuity: true
trackSwitch: true
contiguous: false
accurateTimeOffset: false
timeOffset: 0
initSegmentChange: true
hls.js@1:1 [log] > [stream-controller]: Loaded fragment 0 of level 0
bc72ec7a-ff86-4b9a-997a-b04f01ca8570:1 [log] > Debug logs enabled for "main" in hls.js version 1.5.8
hls.js@1:1 [log] > [mp4-remuxer]: ISGenerated flag reset
hls.js@1:1 [log] > [mp4-remuxer]: initPTS & initDTS reset
hls.js@1:1 [log] > [mp4-remuxer]: reset next timestamp
hls.js@1:1 [log] > manifest codec:undefined, ADTS type:2, samplingIndex:3
hls.js@1:1 [log] > parsed codec:mp4a.40.5, rate:48000, channels:2
hls.js@1:1 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.js@1:1 [log] > [stream-controller]: Init audio buffer, container:audio/mp4, codecs[selected/level/parsed]=[//mp4a.40.5]
hls.js@1:1 [log] > [stream-controller]: Init video buffer, container:video/mp4, codecs[level/parsed]=[/avc1.64042a]
hls.js@1:1 [log] > [buffer-controller] 0 bufferCodec event(s) expected audio,video
hls.js@1:1 [log] > [buffer-controller] creating sourceBuffer(audio/mp4;codecs=mp4a.40.5)
hls.js@1:1 [log] > [buffer-controller] creating sourceBuffer(video/mp4;codecs=avc1.64042a)
hls.js@1:1 [log] > [audio-stream-controller]: InitPTS for cc: 1 found from main: 68940
hls.js@1:1 [log] > [transmuxer.ts]: Flushed fragment 0 of level 0
hls.js@1:1 [log] > [stream-controller]: PARSING->PARSED
hls.js@1:1 [log] > [stream-controller]: Buffered main sn: 0 of level 0 (frag:[0.000-4.166] > buffer:[0.000-4.096])
hls.js@1:1 [log] > [stream-controller]: PARSED->IDLE
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 MISSED
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 1993 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,0], cc [1, 1] duration:4.166
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 MISSED
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 1990 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,0], cc [1, 1] duration:4.166
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 REFRESHED 1--1
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 3992 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,1][part-1--1], cc [1, 1] duration:8.332
hls.js@1:1 [log] > [stream-controller]: Loading fragment 1 cc: 1 of [0-1] level: 0, target: 4.166
hls.js@1:1 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls.js@1:1 [log] > [buffer-controller] Updating Media Source duration to 8.332
hls.js@1:1 [log] > [stream-controller]: Loaded fragment 1 of level 0
hls.js@1:1 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.js@1:1 [log] > [transmuxer.ts]: Flushed fragment 1 of level 0
hls.js@1:1 [log] > [stream-controller]: PARSING->PARSED
hls.js@1:1 [log] > [stream-controller]: Buffered main sn: 1 of level 0 (frag:[4.096-8.333] > buffer:[0.000-8.213])
hls.js@1:1 [log] > [stream-controller]: PARSED->IDLE
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 REFRESHED 2--1
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 3988 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,2][part-2--1], cc [1, 1] duration:12.5
hls.js@1:1 [log] > [stream-controller]: Loading fragment 2 cc: 1 of [0-2] level: 0, target: 8.333
hls.js@1:1 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls.js@1:1 [log] > [buffer-controller] Updating Media Source duration to 12.500
hls.js@1:1 [log] > [stream-controller]: Loaded fragment 2 of level 0
hls.js@1:1 [log] > Video: Initial PTS/DTS adjusted: 8333/8267, delta: -1 ms
hls.js@1:1 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.js@1:1 [log] > [transmuxer.ts]: Flushed fragment 2 of level 0
hls.js@1:1 [log] > [stream-controller]: PARSING->PARSED
hls.js@1:1 [log] > [stream-controller]: Buffered main sn: 2 of level 0 (frag:[8.213-12.498] > buffer:[0.000-12.373])
hls.js@1:1 [log] > [stream-controller]: PARSED->IDLE
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 REFRESHED 3--1
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 3991 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,3][part-3--1], cc [1, 1] duration:16.665
hls.js@1:1 [log] > [stream-controller]: Loading fragment 3 cc: 1 of [0-3] level: 0, target: 12.498
hls.js@1:1 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls.js@1:1 [log] > [buffer-controller] Updating Media Source duration to 16.665
hls.js@1:1 [log] > [stream-controller]: Loaded fragment 3 of level 0
hls.js@1:1 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.js@1:1 [log] > [transmuxer.ts]: Flushed fragment 3 of level 0
hls.js@1:1 [log] > [stream-controller]: PARSING->PARSED
hls.js@1:1 [log] > [stream-controller]: Buffered main sn: 3 of level 0 (frag:[12.373-16.666] > buffer:[0.000-16.533])
hls.js@1:1 [log] > [stream-controller]: PARSED->IDLE
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 REFRESHED 4--1
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 3994 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,4][part-4--1], cc [1, 1] duration:20.832
hls.js@1:1 [log] > [stream-controller]: Loading fragment 4 cc: 1 of [0-4] level: 0, target: 16.666
hls.js@1:1 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls.js@1:1 [log] > [buffer-controller] Updating Media Source duration to 20.832
hls.js@1:1 [log] > [stream-controller]: Loaded fragment 4 of level 0
hls.js@1:1 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.js@1:1 [log] > [transmuxer.ts]: Flushed fragment 4 of level 0
hls.js@1:1 [log] > [stream-controller]: PARSING->PARSED
hls.js@1:1 [log] > [stream-controller]: Buffered main sn: 4 of level 0 (frag:[16.533-20.833] > buffer:[0.000-20.715])
hls.js@1:1 [log] > [stream-controller]: PARSED->IDLE
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 REFRESHED 5--1
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 3983 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,5][part-5--1], cc [1, 1] duration:25
hls.js@1:1 [log] > [stream-controller]: Loading fragment 5 cc: 1 of [0-5] level: 0, target: 20.833
hls.js@1:1 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls.js@1:1 [log] > [buffer-controller] Updating Media Source duration to 25.000
hls.js@1:1 [log] > [stream-controller]: Loaded fragment 5 of level 0
hls.js@1:1 [log] > Video: Initial PTS/DTS adjusted: 20833/20767, delta: -1 ms
hls.js@1:1 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.js@1:1 [log] > [transmuxer.ts]: Flushed fragment 5 of level 0
hls.js@1:1 [log] > [stream-controller]: PARSING->PARSED
hls.js@1:1 [log] > [stream-controller]: Buffered main sn: 5 of level 0 (frag:[20.715-24.998] > buffer:[0.000-24.875])
hls.js@1:1 [log] > [stream-controller]: PARSED->IDLE
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 REFRESHED 6--1
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 3995 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,6][part-6--1], cc [1, 1] duration:29.165
hls.js@1:1 [log] > [stream-controller]: Loading fragment 6 cc: 1 of [0-6] level: 0, target: 24.998
hls.js@1:1 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls.js@1:1 [log] > [buffer-controller] Updating Media Source duration to 29.165
hls.js@1:1 [log] > [stream-controller]: Loaded fragment 6 of level 0
hls.js@1:1 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.js@1:1 [log] > [transmuxer.ts]: Flushed fragment 6 of level 0
hls.js@1:1 [log] > [stream-controller]: PARSING->PARSED
hls.js@1:1 [log] > [stream-controller]: Buffered main sn: 6 of level 0 (frag:[24.875-29.166] > buffer:[0.000-29.035])
hls.js@1:1 [log] > [stream-controller]: PARSED->IDLE
hls.js@1:1 [log] > [level-controller]: Loading level index 0 with http://..../hls/stream1.m3u8
hls.js@1:1 [log] > [level-controller]: live playlist 0 REFRESHED 7--1
hls.js@1:1 [log] > [level-controller]: reload live playlist 0 in 3992 ms
hls.js@1:1 [log] > [stream-controller]: Level 0 loaded [0,7][part-7--1], cc [1, 1] duration:33.332
hls.js@1:1 [log] > [stream-controller]: Loading fragment 7 cc: 1 of [0-7] level: 0, target: 29.166
hls.js@1:1 [log] > [stream-controller]: IDLE->FRAG_LOADING
hls.js@1:1 [log] > [buffer-controller] Updating Media Source duration to 33.332
hls.js@1:1 [log] > [stream-controller]: Loaded fragment 7 of level 0
hls.js@1:1 [log] > [stream-controller]: FRAG_LOADING->PARSING
hls.js@1:1 [log] > [transmuxer.ts]: Flushed fragment 7 of level 0
hls.js@1:1 [log] > [stream-controller]: PARSING->PARSED
hls.js@1:1 [log] > [stream-controller]: Buffered main sn: 7 of level 0 (frag:[29.035-33.333] > buffer:[0.000-33.216])
hls.js@1:1 [log] > [stream-controller]: PARSED->IDLE

logs

[robwalch]

Playback is expected to start three target durations (#EXT-X-TARGETDURATION) from the end of the playlist, unless an optional SERVER-CONTROL tag defines a value for HOLD-BACK, or you configure HLS.js to use a custom liveSyncDurationCount or liveSyncDuration.

[franticboDev]

Ok, so can you give me a code sample of liveSyncDurationCount, to maybe start playback eariler? It's kind of annoying to manully seek forward. Also sorry for the many questions, I'm new to the HLS stuff and to JavaScript.

[robwalch]

Your stream has 4 second seconds. The appropriate hold back would be 12 seconds. You cannot play 3 seconds behind the edge without stalling with this kind of HLS playlist. You need Low-Latency HLS parts to achieve lower latency.

[franticboDev]

Ok, thanks a lot!