TheWidlarzGroup / react-native-video

A <Video /> component for react-native

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[BUG]: HLS Streaming is not giving seamless streaming experience.

MdAbubakar opened this issue · comments

Version

6.2.0

What platforms are you having the problem on?

Android

System Version

Android 12, 13, 14

On what device are you experiencing the issue?

Real device

Architecture

Old architecture

What happened?

I'm using this library for HLS streaming and I'm using m3u8 URL. Earlier it was good, but now it's not giving seamless HLS video streaming the video is stopping in between just for milliseconds.

Reproduction

repository link

Reproduction

Step to reproduce this bug are: Just try to play some m3u8 URL atleast 30 minutes video then you can easily find the issue.

@freeboub Please check the issue as I really need this issue to be fixed.

Thanks in advance!

@MdAbubakar , I am sorry, but I don't have time to do 30 min streaming... I am afraid, You will need to investigate more on your side.
It seems you are pointing out the issue as a regression.

  • Can you clarify which version is working fine ?
  • Did you try to record a memory trace ? (Maybe due to a memory leak).
  • Are you able to reproduce it with the sample ?
  • I wonder if another component can also leak ?

@freeboub You can check with the 5-minute video also,
for your reference, I'm giving my implementation of the video player:

It was working fine in v6.0.0-alpha.11

<Video
source={{
uri: videoURL,
}}
style={styles.video}
resizeMode={
showFullscreen && fitToScreen
? ResizeMode.COVER
: inPipMode
? ResizeMode.COVER
: ResizeMode.CONTAIN
}
ref={videoRef}
onProgress={handleVideoProgress}
// repeat={true}
playInBackground={false}
poster={videoSource?.image_url}
posterResizeMode="contain"
paused={isCasting ? true : preAds ? true : showAd ? true : paused}
fullscreen={showFullscreen}
fullscreenOrientation={"landscape"}
onLoadStart={() => {
setIsLoading(true);
setPaused(true);
}}
onLoad={handleVideoLoad}
selectedVideoTrack={{
type:
selectedResolution === 0
? SelectedVideoTrackType.AUTO
: SelectedVideoTrackType.RESOLUTION,
value: selectedResolution === 0 ? "NA" : selectedResolution,
}}
volume={volume}
shouldPlay={true}
onEnd={() => {
if (isInPipMode) {
PipHandler.exitPipMode();
}
if (preview) {
Orientation.lockToPortrait();
}
onEnd();
}}
bufferConfig={{
minBufferMs: 15000,
maxBufferMs: 90000,
bufferForPlaybackMs: 3000,
bufferForPlaybackAfterRebufferMs: 10000,
backBufferDurationMs: 120000,
cacheSizeMB: 10,
}}
onBuffer={() => {
if (isCasting) {
setIsLoading(false);
} else {
setIsLoading(true);
}
}}
onAudioFocusChanged={event => {
if (!event.hasAudioFocus) {
setPaused(true);
setActiveCall(true);
} else {
setPaused(false);
setActiveCall(false);
}
}}
/>

I'm experiencing this degradation of quality as well on 6.2.0 but I saw it on 6.1.1 as well. Will continue to debug, I'm using all the default settings for BufferConfig (as in I'm not sending anything into it).

@paulrinaldi @MdAbubakar it would be a very good information to know on which version the regression happened... I agree it's not fun to do dichotomy to find a regression 😣

@freeboub it fixed after adding these params:

useTextureView={false}
disableFocus={true}
shouldPlay={true}