persistent m3u8 requests and detached DOM nodes after unmount

[samchienGG]

🔍 Observed Problem Phenomena

When using ReactPlayer with m3u8 streams, the following abnormal behaviors are observed in Chrome DevTools

📊 Network Panel Observations Continued requests after unmount: m3u8 requests persist after route changes or component unmounting

🧠 Memory Panel Observations Growing Detached DOM Nodes: Each component unmount leaves uncleaned nodes

🎯 Affected Scenarios Any scenario that causes ReactPlayer component unmounting

React Router route changes Conditional rendering toggles ({show && <ReactPlayer />}) List item key changes Component remounting

💭 Suspected Root Cause

1. hls.js instance timers aren't cleared
2. Nnetwork requests aren't aborted
3. Event listeners aren't removed

[msoltyk-flixtok]

Same issue

[luwes]

This behavior is inline with how the native video behaves, if you remove it from the DOM it will still keep playback intact.

Try setting the src to null before unmounting.