[Video] Flush low quality segments once focused #5430
Conversation
|
| } | ||
| hlsRef.current.on(Hls.Events.FRAG_CHANGED, fragChanged) | ||
|
|
||
| const current = hlsRef.current |
There was a problem hiding this comment.
it would be best to capture this once at the top of the effect and then always use this reference instead of dereferencing during events. fewer things that can go wrong.
There was a problem hiding this comment.
Should I also use the captured version within the listener?
| _event: Events.FRAG_CHANGED, | ||
| {frag}: FragChangedData, | ||
| ) { | ||
| if (!hlsRef.current) return |
There was a problem hiding this comment.
i mean here (and in the method itself), can you use the captured variable instead? likewise everywhere. so that everything in this effect always refers to the same instance.
There was a problem hiding this comment.
can do, I've never been sure what the best way to go about it is
|
This video is freezing whenever it replays. Audio continues but video does not https://social-app-pr-5430.onrender.com/profile/phantasmajones.net/post/3l4tkpes56w22 Not doing that for me on main/prod. |
arcalinea
temporarily deployed
to
samuel/video-buffering - social-app PR #5430
Render
Destroyed
* origin/main: Remove image resizer (#5464) Remove `react-native-fs` (#5463) Revamp image editor (#5462) Revamp edit image alt text dialog (#5461) MobX removal take 2 (#5381) Edit self hosting copy (#5469) Automatically optimise SVG assets (#5467) [Share Extension] Update to support video (#5385) Revert change in FAB animation (#5465) Improvements to NSE (#4992) Don't use flex on inputs (#5458) Fix web splash (#5456) invert the fab animation, play a haptic (#4309) add sideborders to <ProfileHeaderLoading> (#4995) [Video] Flush low quality segments once focused (#5430)
Fixes #5315
By default, once a fragment (~5 seconds of video) is loaded by HLS.js, it sticks around indefinitely. This means that the initial low-res fragments (which at minimum is the first 9 seconds of the video) stay low-res even after the video loops.
Solution:
FRAG_BUFFEREDevent.This shouldn't result in unbounded loading of data - it only triggers the eviction if it has sufficient network conditions to load hi-res fragments, and once something is hi-res it should never be subsequently evicted.
This also fixes a bug which would result in the hi-res version loading regardless of whether the video was focused, so it might even reduce bandwidth use!
Test plan
This is tricky to test. I would suggest adding logs to the flushing event trigger (VideoEmbedInnerWeb.tsx:109) and logging the
lowQualityFragmentsstate. Also keep an eye on the network tag, and just review the video to ensure that the first ~9 seconds are hi-res after loopingA good video to test with: https://bsky.app/profile/haileyok.com/post/3l4ioa5mudh25