react-native-yz-vlcplayer
react-native-yz-vlcplayer copied to clipboard
RTSP Caching
Hello I'm working on a video application with an RTSP stream. Is it possible to reduce latency in another way than :
initOptions={[ "--rtsp-tcp", "--network-caching=" + 0, "--rtsp-caching=" + 0, "--tcp-caching=" + 0, "--realrtsp-caching=" + 0, ]}
Thanks.
maybe you should set 150 --- 300 replace 0
Hello,
Thank you for your answer but I have already tried and it doesn't work though I added this:
mediaOptions={{ ':network-caching': 0, ':live-caching': 0, }}
and it works very well for iOS, I no longer have a lag at all but it doesn't work on android at all. Do you have any idea? Here is my code:
<VlcSimplePlayer
style={{position: 'absolute', height: '100%'}}
url={streamUrl}
videoAspectRatio={wp(100) + ':' + hp(100)}
autoAspectRatio={true}
isLive={true}
autoplay={true}
autoReloadLive={true}
initOptions={[
"--rtsp-tcp",
"--network-caching=" + 0,
"--rtsp-caching=" + 0,
"--no-stats",
"--tcp-caching=" + 0,
"--realrtsp-caching=" + 0,
]}
hwDecoderEnabled={1}
hwDecoderForced={1}
mediaOptions={{
':network-caching': 0,
':live-caching': 0,
}}
/>
Thank you.
Sorry, I have no idea
Do you have any idea where to look?
@StevenB45 Hi I solved it by editing his code.
ReactVlcPlayerView.java
m.addOption(":network-caching=150"); // line 394
mMediaPlayer.setMedia(m);
mMediaPlayer.setScale(0);
Hello,
Thank you for this answer I will try!
Thank you very much!!!!
Hello,
Thank you for this answer I will try!
Thank you very much!!!!
If you use my fork, you should use mediaOptions.
<VLCPlayer
style={{flex: 1}}
mediaOptions={[
":network-caching=300"
]}
source={{uri: Config.rtsp}}
onPlaying={this.onPlaying}
/>
Hello, I tried your solution but it doesn't work. In your ReactVlcPlayerView.java, line 394 is commented and latency is not reduced with android.
I send motion commands to a camera that broadcasts RTSP and I try to reduce the latency between pressing a button and displaying the video. This works on iOS by modifying
':network-caching': 0,
':live-caching': 0,
directly into the module.
I use the VlcSimplePlayer component.
Thanks
@fh345392977 Thank you, i've tried your fork and it works very well on android, but i have a problem :
on iOS: initType={2} not working like the original
initOptions={[
"--network-caching=" + 30
]}
is not working. On android, the video is displayed in 3-4 seconds with this setting, but on iOS it doesn't seem to work (10-15 seconds).
Have you an idea?
Thank you so much for your work!
Hi,
working with this code on iOS:
<VlcSimplePlayer
style={{position: 'absolute', height: '100%'}}
url={streamUrl}
videoAspectRatio={wp('100%') + ':' + hp('100%')}
autoAspectRatio={true}
isLive={true}
autoplay={true}
autoReloadLive={true}
initType={2}
initOptions={[
'--network-caching=' + 30,
]}
mediaOptions={{
':network-caching': 30,
}}
/>
But, the application crashes... I open a first stream, everything goes well, I have the video in 3-4 seconds but once I open this stream or another one after the second or third time, the application freezes and crashes. No problem with an initType={1} I don't understand...
@StevenB45 Actually I edit some code in my fork, I will check it again when I'm free this week.
@fh345392977 Thank you so much! I do not have any errors in the log, I don't understand. Thank you again for your answers. !
Hi @fh345392977 , @xuyuanzhou .
How to reproduce my problem :
-
git clone https://github.com/StevenB45/vlc-crash-test.git
- Download MobileVLCKit.framework
- Copy file into 'vlcKit' folder
-
yarn install
- Open project with Xcode, and set 'iOS Deployment Target' to 9.3
- Run the project
- Click on "PLAY" and "GO BACK"
- After once or twice tries the app crashes
- if you set
initType={1}
in "App.js", no problems but `initOptions" won't work.
Thanks 🙏
@StevenB45 About ios crash, you can try this. https://github.com/xuyuanzhou/react-native-yz-vlcplayer/issues/34#issuecomment-472399327
@fh345392977 thank you very much. The test build of application that I'm working on does not crash anymore but the player does not close properly. Sound is being reproduced in the background on different channels.
@StevenB45 I also tried bu commenting out code mention by @fh345392977 , it worked but had player not closing issue , what I did for this was, I did save player object to a reference and pause the player when un mounting the component and setting null to player object, It solve the issue but still there is a memory stacking issue memory does not create when close the player
vlcPlayer;
componentWillUnmount() {
/**
* Pause player when un-mounting the component to resolve a VLC bug
*
* TODO: even though player got paused memory get stacking , find a solution to clean memory
*/
if(Platform.OS === 'ios') {
this.vlcPlayer.pause();
this.vlcPlayer = null;
}
}
render() {
<View>
<VlcSimplePlayer
ref={ref => (this.vlcPlayer = ref)}
url={streamUrl}
autoplay={true}
isLive={true}
autoReloadLive={true}
style={{width: "100%", height: 200, marginTop: 30}}
onStartFullScreen={this.onStartFullScreen}
onCloseFullScreen={this.onCloseFullScreen}
initType={2}
hwDecoderEnabled={1}
hwDecoderForced={1}
initOptions={[
"--no-audio",
"--rtsp-tcp",
"--network-caching=" + 150,
"--rtsp-caching=" + 150,
"--no-stats",
"--tcp-caching=" + 150,
"--realrtsp-caching=" + 150,
]}
/>
</View>
}
Thank you @cchamikara, we have recompiled the MobileVLCKit.framework to directly integrate the cache inside and now it's working for me.
@StevenB45 could you please share how did you do that ?
@cchamikara we have followed the documentation : VLCKit. It's very complicated to compile without errors.
@StevenB45 have you integrate "--rtsp-tcp" along with other init options directly as well ? if so will you be able to share compiled framework with me ? as I'm also facing same issue as you and above fix cause to a memory stacking
@cchamikara we have added @"--rtsp-tcp", @"--network-caching=150", @"--rtsp-cachin=150", @"--clock-jitter=150", @"--tcp-caching=150", @"--realrtsp-caching=150",
into VLCLibrary.m
@StevenB45 thanks will give it a try , did you use master branch of VLCKit and ran compileAndBuildVLCKit.sh
command ? is that it ? (because VLCKit wiki says to run ./compileAndBuildMobileVLCKit.sh -f but that bash file is not there )
@cchamikara I sent you an email to download the file, did you receive it? We used "3.0" branch.
@StevenB45 I got it thank you very much
@cchamikara :
<VlcSimplePlayer
style={{position: 'absolute', height: '100%'}}
url={streamUrl}
videoAspectRatio={wp('100%') + ':' + hp('100%')}
isLive={true}
autoplay={true}
autoReloadLive={true}
mediaOptions={{
':network-caching': {cameraCache},
':live-caching': {cameraCache},
}}
/>
I faced the same problem in here is my solution:
<VLCPlayer
style={{ width:"100%", height:'100%' }}
source={{ uri : 'rtsp://...' }}
mediaOptions={{
':network-caching': 150,
':live-caching': 0,
':file-caching': 0,
':live-caching': 0,
':network-caching': 150,
':clock-jitter': 0,
':clock-synchro': 0,
}}
initType={2}
initOptions={[
"--no-audio",
"--no-stats",
"--rtsp-tcp",
]}
/>
@cchamikara :
<VlcSimplePlayer
style={{position: 'absolute', height: '100%'}}
url={streamUrl}
videoAspectRatio={wp('100%') + ':' + hp('100%')}
isLive={true}
autoplay={true}
autoReloadLive={true}
mediaOptions={{
':network-caching': {cameraCache},
':live-caching': {cameraCache},
}}
/>
Hi Steven, Have you resolved the iOS crash issue, I have built MobileVLCKit.framework by myself, the crash issue is the same!
@cchamikara I sent you an email to download the file, did you receive it? We used "3.0" branch.
can u send me the correct libary ?
我在这里遇到的问题是我的解决方案:
<VLCPlayer style={{ width:"100%", height:'100%' }} source={{ uri : 'rtsp://...' }} mediaOptions={{ ':network-caching': 150, ':live-caching': 0, ':file-caching': 0, ':live-caching': 0, ':network-caching': 150, ':clock-jitter': 0, ':clock-synchro': 0, }} initType={2} initOptions={[ "--no-audio", "--no-stats", "--rtsp-tcp", ]} />
@MaximusBaton It works, but there is no sound in the hard interpreted video. I will change "inittype" to "1" to have sound