How does VideoJS determine when to use HLS vs MP4 video when both sources are available?

user_193116 0
Viewed 6279

I have a video encoded in MP4 as well as HLS (m3u8)format. I want VideoJS to use MP4 for desktops browser vs m3u8 for devices . The latest version of VideoJS supports both formats . I am trying to determine if videojs can automatically figure out which source to use. Or does my code have to detect browser and pass the best source type to videojs.

video.js html5-video video
2 Answers

MP4 and HLS are actually different types of thing in the video delivery ecosystem.

MP4 is a container format, containing encoded video, audio etc tracks in a single file and HLS is a streaming protocol, which can stream a video in a container like MP4 from a server to a client.

The terminology can be a bit confusing and the terms are often not used precisely but a simple overview is:

  • 'raw' video - this is the uncompressed frames
  • encoded video - typically compressed by the codec,. e.g. h.264, h.265, AV1 etc
  • container (e.g. FLV, MP4) - the container can include one or more 'tracks' encoded video, audio, subtitles plus metadata including encryption information.
  • fragmented container (e.g. fragmented MP4) - this allows the video container to be broken into segments or chunks to support streaming and in particular ABR (see below)
  • Streaming protocol including index and segments or fragments of video (e.g. HLS, DASH, Smooth Streaming)

The Streaming Protocol facilitates Adaptive Bit Rate streaming, ABR, which in simple terms means you provide multiple different bit rate versions of your video and the client device or player can download the video in chunks, e.g 10 second chunks, and select the next chunk from the bit rate most appropriate to the device and the current network conditions. See some more info in this answer also: https://stackoverflow.com/a/42365034/334402

In general, ABR protocols will give better performance so you would typically always select one rather than simply progressively downloading and playing the MP4 file itself when streaming your video.

It may be that you are concerned about some devices or browsers not supporting HLS. Most devices and HTML5 players probably will now but major video streaming services will usually provide HLS and MPEG-DASH streams for each video and this will cover the vast majority of devices.

user_3344020

You can't provide both sources at once to any video player, leave alone VideoJS.

It's one or the other.

The source in your <video> tag should either be a .mp4 (signed or straight-up).

Or it should be to a .m3u8 playlist.

You might have both available in your bucket/folder. But you can only provide one of them at a time as a source for a single player.

user_7411790
Related