Efficient products for your streaming infrastructure


HTML5 playback for SLDP

Ultra-low latency via JavaScript freeware player

SLDP is a streaming protocol based on WebSockets so its streams can be processed in modern browsers.

HTML5 SLDP Player key features include the following:

  • Sub-second delay in playback with buffer offset if needed.
  • H.264/AVC, VP8 and VP9 video.
  • AAC audio in all supported browsers.
  • MP3 audio in Safari and Firefox.
  • Adaptive bitrate (ABR) support with automatic renditions switch according to network conditions. Switch time is limited only by GOP size.
  • Delivery methods are HTTP and HTTPS on top of TCP which means you don't need any special network settings.

Please also take a look at frequently asked questions to see advantages and best techniques of SLDP usage.

Browser support

SLDP browser playback is based on MSE. The player is created with JavaScript and it can be embedded in any HTML5 page.

It's currently supported by Chrome, Firefox, Safari, Microsoft Edge, Chromium on Windows, Linux, macOS, Android and Safari on iPad iOS platforms.
General iOS browser playback is not yet available. However you can install our SLDP Player for iOS which is opened on clicking sldp:// and sldps:// links. You may create your own iOS apps for SLDP playback using SLDP Player iOS SDK.

Please notice that IE 11 and Microsoft Edge browsers currently require to buffer at least 3 seconds before starting the stream. So SLDP Player will have additional latency there.


Download and embed

SLDP Player is available for free download. Release notes are here.

You can embed it as shown on the following example below.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<script src="sldp-v2.12.2.min.js"></script>
</head>
<body>
<div id="player"></div>

<script type="text/javascript">
document.addEventListener("DOMContentLoaded", initPlayer);

function initPlayer(){
sldpPlayer = SLDP.init({
container: 'player',
stream_url: "ws://123.123.123.123:8081/live/stream",
initial_resolution: '240p',
buffering: 500,
autoplay: false,
height: 480,
width: 424
});
};

function removePlayer(){
sldpPlayer.destroy()
}
</script>
</body>
</html>

Control parameters

Parameters below can be used for player setup.

  • container parameter indicates the page element to use for display
  • stream_url defines the URL to connect in order to start receiving the content. The origin needs to have SLDP support to provide the stream. Check Nimble Streamer as example.
  • autoplay defines whether the stream needs to be played right after the player is initialized. Not all modern browsers allow autoplay with sound, so you can use 'muted' parameter to meet the restriction.
  • muted defines whether player is muted on start. Can be helpful to autoplay video in modern browsers.
  • width defines the width of the player. Possible values: integer (width in pixels) or 'parent' string (occupies 100% of parent element's width).
  • height defines the height of the player. Possible values: integer (height in pixels) or 'parent' string (occupies 100% of parent element's height).
  • initial_resolution is the default resolution in case you use ABR stream.
  • buffering is playback delay in milliseconds. Default value is 1000 (1 second).
  • offset parameter allows decreasing start time for streams. Read this article for more details.
  • latency_tolerance latency retention parameter expressed in milliseconds. When initial latency has become greater than the specified value (due to whatever reason, like network conditions or CPU performance), it forces player to reestablish the initial latency as it becomes possible. It's important to understand, that latency retention has its cost, the player skips a part of stream to preserve latency. The rough analogy can be TV broadcast, when corrupted image is displayed but the whole stream is not delayed. Read this article for more details. The minimal recommended value is 400-500 milliseconds, 0 - the parameter is switched off.
  • splash_screen defines the URL to splash image.
  • adaptive_bitrate enable or disable ABR. "true" (default) - enabled, "false" - disabled.
  • pause_timeout when playback is paused it specifies period of time during which connection to media server is retained and closed right after that period. It allows to save extra traffic passed from media server to the client during long pause.
  • key_frame_alignment allows to obtain smooth rendition switching if all renditions are key frame aligned, i.e. key frames in every rendition have same timestamps. Default value is false.
  • controls defines whether control elements, e.g. play, pause, volume, etc. are shown to user. Default value is true.
  • audio_only enables audio only mode. If enabled, only audio part of given SLDP stream is reproduced and player UI is collapsed to control bar. Defaul value is false.
  • audio_title player title, which is displayed in audio only mode. By default, it's not set.
  • reconnects number of reconnect attempts, those SLDP player performs when connection to media server is lost. Must be greater than 0, default value is 10. First 5 attempts are performed every second, the rest attempts are performed every 5 seconds.
  • muteable enables automatic compensation of missing audio stream. This parameter is necessary if target stream doesn't contain audio samples when it's muted. Default value is false.
  • fullscreen defines whether to start player in a full screen mode. By default, it's false.
  • ios_failback_app_url SLDP iOS fallback application URL. By default it's SLDP Player. Read this article for more details.
  • ios_failback_scheme SLDP iOS fallback scheme for non-secure connection (ws://). By default, it's 'sldp'
  • ios_failback_secure_scheme SLDP iOS fallback scheme for secure connection (wss://). By default, it's 'sldps'
  • aspect_ratio (SDK only) defines aspect ratio which video is adjusted to, e.g. '16:9'.

You can use SLDP player free of charge with no limitations. However, technical support is provided only for SDK customers.

SLDP Player SDK

Premium SDK package has JavaScript-based library with an additional API to operate.
You can visit SDK documentation page to learn more about this SDK.

This SDK is available for subscribed customers only. Being subscribed, you be able to get updates and our technical support.

Buy player SDK

Demos

You can try web player on this testing page if you have SLDP being available in Nimble Streamer.
Nimble Advertizer demo page shows SLDP with server-side ads insertion via SLDP HTML5 player.