minimize latency

Issues when playing live broadcasts with Unreal HTML5 MSE player on a web page

minimize latency

Postby chmg » Mon Oct 10, 2016 5:29 am

Hi,

at the moment I am trying to replace the old browser plugin with the new HTML5 player.

But now I have a problem. The HTML5 player does too much buffering.
In my case it is very importent to have very low latency from the video source to the browser.

After starting the playback on the HTML5 client I have nearly 3 seconds delay, but after 15 minutes of playback it is already 10 seconds delay.
Is there any way to disable the buffering at the HTML5 client?

Background:
We are developing a IPTV solution with differend STB´s.
For our testers, we have set up a website where they can see the HDMI output of the STB and control it via a virtual remote control.
See a screenshoot at: https://www.ptlda.net/Remcon1.png

It is not good that the tester presses a button on the remote control and sees the result on the stream 10 seconds later.

At this point we have no problem with not so good video quality, artefacts or so on.
With the browser plugin it works perfect.

Regards,
Christian
chmg
 
Posts: 0
Joined: Mon Oct 10, 2016 3:20 am

Re: minimize latency

Postby admin » Mon Oct 10, 2016 10:28 am

Hi,

First of all, The HTML5 player uses MSE (media source extensions) which are still getting improved by browsers. We have also observed this behavior in IE and Edge, but in Chrome/Opera the latency stays constant.
So for now Chrome is a recommended browser.

Secondly, you can add some JavaScript code to your webpage to jump to real-time periodically, to compensate for that issue. Just find video element (for player created with "UnrealPlayer1" it will be "UnrealPlayer1_Video") and do
video.currentTime = video.duration;

Here is the code that will jump to real-time every 30 seconds:

<script type="text/javascript">
if ("MediaSource" in window && "WebSocket" in window)
{
RunPlayer("UnrealPlayer1", 800, 600, "localhost", 5119, false, "webcam", "", false, true, 1, "", false);

setInterval(function ()
{
var video = document.getElementById("UnrealPlayer1_Video");
video.currentTime = video.duration;
}, 30000);
}
</script>
admin
Site Admin
 
Posts: 1030
Joined: Fri Aug 21, 2009 10:13 am

Re: minimize latency

Postby chmg » Wed Oct 12, 2016 6:38 am

Hi,

thank you for your replay.

With Chrome the stream works very well.

Additional I found an other prblem at my test setup.
On my test setup I had a LiveServer 9.0.
After update it to 9.5 the stream runs much better on the HTML5 player.

Now we try to integrate the HTML5 player into our application.

Regards,
Christian
chmg
 
Posts: 0
Joined: Mon Oct 10, 2016 3:20 am

Re: minimize latency

Postby admin » Sun Nov 12, 2017 12:19 pm

Another technique that may help to stay close to real time, which can be useful for "real-time" video-only streams,
is to set the player to play with faster rate, like 1.5 or 2. It works nice in Chrome.

var video1 = document.getElementById("UnrealPlayer1_Video");
video1.playbackRate=2;

This will not exhibit the jerkiness of the "jump" to the end of the live feed that you see every 30 seconds...

This will still play at normal speed as long as you are playing at real-time position. i.e. you didn't seek back, so it will always stay as close to real-time as possible.
If you seek back then of course it will play faster.
If you use this technique, you may want to specify intLocalSeekMinutes parameter to be 0, so there is no local seek ability, and you are always playing at real-time position.
admin
Site Admin
 
Posts: 1030
Joined: Fri Aug 21, 2009 10:13 am

Re: minimize latency

Postby kpgchd » Thu Jan 03, 2019 7:12 am

Hi

I had set
video1.playbackRate=2;
and
intLocalSeekMinutes parameter to be 0
On start for few seconds it works fine But later with time the latency keeps increasing... on mobile devices
kpgchd
 
Posts: 0
Joined: Mon Nov 05, 2018 2:39 am

Re: minimize latency

Postby kpgchd » Thu Jan 03, 2019 8:25 am

[quote="kpgchd"]
video1.playbackRate=2;
and
intLocalSeekMinutes parameter to be 0[/quote]


I want to add that
1. In WebRTC player I had not set playbackrate and intLocalSeekMinutes even though its working fine in PCs.
But in HTML5 MSE Player on mobile device I am having this issue.
2. Mostly when video get freeze due some frame loss or something it get started increasing latency...

I don't know where I am wrong. Please guide...
kpgchd
 
Posts: 0
Joined: Mon Nov 05, 2018 2:39 am

Re: minimize latency

Postby admin » Thu Jan 03, 2019 10:02 am

WebRTC player always has low latency by definition.

But in MSE player the latency, unfortunately, can grow.
So why don't you combine the two methods for MSE player?
Every 30 seconds jump to real-time, and also use high playback rate.
admin
Site Admin
 
Posts: 1030
Joined: Fri Aug 21, 2009 10:13 am

Re: minimize latency

Postby kpgchd » Fri Jan 04, 2019 7:49 am

Hi admin

I had tried putting both but still have latency increasing 5-6 seconds and more sometimes.
Even I reduced 30 to 1-2 seconds.

So, Please-Please guide how can I use WebRTC player in android app ?
kpgchd
 
Posts: 0
Joined: Mon Nov 05, 2018 2:39 am

Re: minimize latency

Postby admin » Fri Jan 04, 2019 9:00 am

Don't reduce it to 1-2 seconds, it's not going to play smooth.
Maybe 10 seconds is OK.
admin
Site Admin
 
Posts: 1030
Joined: Fri Aug 21, 2009 10:13 am


Return to Playing with HTML5 MSE Player

Who is online

Users browsing this forum: No registered users and 0 guests

cron