Setting up a low latency HTML5 channel : Walkthrough

You are here:
< Back

Please read the following carefully before creating a low latency channel in your DaCast account:

1/ Low latency channels with Safari

Our secure low latency html5 streaming solution works on most devices and all browsers except Safari desktop (working on Safari mobile for iOS version 10 and below).

*This is because we use Akamai’s standard cookie-based token authentication feature to secure our low latency html5 channels. Third-party cookies are not accepted in Safari desktop and iOS11 and above.

Solution: you have the option to allow 3rd party cookies on Safari.

Here is how to allow 3rd party cookies on Safari from your Mac:
1) Click on the Safari-menu in Safari.
2) Click on the Preferences item in the menu – a new window opens.
3) Click on the Security icon near the top of the window.
4)Under Accept Cookies the Always or Only from sites you navigate to must be selected.
5) Save changes by clicking OK.
This will allow you to play your stream.

Here is how to allow 3rd party cookies on Safari from your iOS phone:
1) Go in your settings section.
2) Click on Safari.
3) In the last section, “Privacy & Security”, turn OFF “Block All Cookies.”

2/ Features of low latency channels

Our low latency html5 channels work exactly like our standard HTML5 channels. They can be used with all the available features in your DaCast account.

However, please note the following:

1) For a free low latency html5 channel, there is an expiration of 6 hours.
=> After 6 hours of viewing, you must refresh your window.

2) For a paying low latency html5 channel, the expiration is the PPV or subscription paywall.
=> if you have a ppv giving 1h of access to the video, the stream will stop after 1h.

3/ Access to low latency channels

Our low latency HTML5 streaming solution is available for existing customers who are premium plans and above. If you are on an event plan, please contact us.

When you use your low latency html5 channels, please make sure they have been created after June 7th, 2017.

How to set up low latency channels 

You will find in the following guide:

-where to find your channel information within your DaCast account to enter in your encoder.

-DaCast’s tips to reduce the latency to the maximum and to deliver the best quality to your viewers.

Part 1: Encoder setup for low latency HTML5

This guide focuses solely on the Encoder Setup step. It is broken into three steps to mimic its presentation on the site:

1. Publishing Point

low latency HTML5

-Publishing Point
Our system auto-detects and optimizes the selection of the publishing point based on the location of your stream.

-Stream Quality
Please note that DaCast does not support adaptative live transcoding for now but soon will!

Right now, DaCast uses a multi-bitrate method for live video, wherein the broadcaster can set up several different stream qualities. Our player is adaptive and automatically detects your encoder multi-bitrate settings to provide the best quality stream to your viewers based upon their connections.

2. Select an Encoder

low latency HTML5

Various encoders are displayed here:

  • OBS Studio: an open broadcaster software that you can use to freely and easily set up your stream. Please be aware that OBS studio does not support multi-bitrate.
  • Wirecast: a paid software encoder available for Max and Windows (a free demo is available, but your broadcasts will contain both video and audio watermarks).
  • VMix: a paid encoder for Windows (free 60-day trial).
  • VIDBlaster: a paid encoder for Windows (free demo available, but your broadcasts will contain a video watermark).

Other RTMP Encoders: you are free to use any hardware or software encoders with DaCast as long as they are RTMP-based.

When choosing the setup in your encoder, make sure your KeyFrame interval is 2 seconds.

3. Start Streaming

  • low latency HTML5

The third step contains the information you need to enter in your encoder to connect it to your DaCast live channel.

– Stream URL and Stream names are always needed.

NOTE: There is no Backup URL for low latency channels.

Example of stream URL: rtmp://lowlatency.dacast.com:1935/live-XXXXX-YYYYYY  (with “XXXXX” being your broadcaster ID and “YYYYYY” being the ID of the live channel)

Example of Stream name: mystreamYYYYYY

Some encoders have one URL field only. If this is your case, please go into the “Other RTMP encoders” (step 2) and click on the link below the back up URL to access a full URL. The full URL is a combination of the Stream URL and the stream name.

Example of a Full URL: rtmp://lowlatency.dacast.com:1935/live-XXXXX-YYYYYY/mystreamYYYYYY

– Login and Password are needed when DaCast is not integrated in the dropdown menu of the encoder.

Example of Login: dacast-123456
Example of Password: 123456

When DaCast is available in the dropdown menu of your encoder, you can log in to your account by using your DaCast credentials.

Part 2: Encoder configuration for the lowest latency and best quality

In this part, we’ll mention all the best settings and configurations for the best quality on your low latency stream. The latency with these recommended settings should remain below 10 seconds (compared to 30-40 seconds for the normal channel).

*You can feel free to change those settings to your liking, but it is likely that the latency and the quality will differ.

1. Wirecast (Windows)

low latency HTML5

  • Encoder: Intel QuickSync H.264
  • Width and Height: will depend on the quality of the stream you want to send to your viewer. A standard definition is 854×480
  • Frames per second: 30 frames
  • Average bitrate: will depend on your internet connection and resolution (for a standard definition you will want to target 500 Kbps – 2 Mbps for video)
  • Quality: Medium (balanced)
  • Profile: Baseline
  • Keyframe every: 60 frames
  • Timecode every:30 frames
  • Channel: Stereo
  • Target bitrate: 128kbps
  • Sample rate: 48 kHz
  • Latency obtained in-house: 8.63s

2. Wirecast (Mac)

low latency HTML5

  • Encoder: Apple H.264
  • Width and Height: will depend on the quality of the stream you want to send to your viewer. A standard definition is 854×480
  • Frames per second : 30 frames
  • Average bitrate: will depend on your internet connection and resolution (for a standard definition you will want to target 500 Kbps – 2 Mbps for video)
  • Profile: High
  • Keyframe every: 60 frames
  • Channel: Stereo
  • Target bitrate: 128 kbps
  • Sample rate: 48 kHz

Latency obtained in-house: 8.39s

3. Vmix

low latency HTML5

The encoder has been set up for a standard definition:

  • Video bitrate: 1025 
  • Resolution: 854×480
  • Audio bitrate: 128
  • Profile: Baseline
  • Level: 1.0
  • Keyframe Frequency: 2 seconds

Latency obtained in-house: 9.23s

4. OBS configuration.

low latency HTML5

The encoder has been set up for a standard definition: 

Output – Streaming:

  • Encoder: x264 
  • Output: 854×480
  • Rate control : VBR 
  • Bitrate: 1,500 
  • CFR: 30 
  • Keyframe interval: 2 
  • CPU: ultrafast 
  • Profile: baselineOutput – Audio
  • Bitrate: 128 kbits

Latency obtained in-house: 8.30

Additional Information

For more detailed tutorials on specific encoders, please have a look at the list below. Note that these tutorials are based on our standard html5 live channel infrastructure:

For additional details on the encoder settings:

  • GOP interval (Keyframe interval) (Paragraph D1)
  • Frame Rate (FPS) (Paragraph D2)
  • Scene Detection (Paragraph D3)
  • Timestamp (Paragraph D4)
  • Interlaced Content (Paragraph D5) 
  • Encoder CPU Load (Paragraph D6)

2 thoughts on “Setting up a low latency HTML5 channel : Walkthrough

    • Etienne Noualhat says:

      Hello Cedric!
      You should be able to create any channel you want, with both the same latency, if you “start” them in the same time.
      Would you be able to write me your exact needs at the following address:
      etienne.noualhat@dacast.com

      I would need more information about your projects to understand it fully and probably get you in touch with one of our engineers!
      (On peut aussi discuter en francais :D)

Leave a Reply

Your email address will not be published. Required fields are marked *