Serving the right video at the right time

Delivering high resolution video content without leaving anyone behind

Go to the profile of Karl Freeman
May 31, 2018
5
3

We've all found ourselves connected to a Wi-fi network which is less than perfect or using our phones with patchy signal. These types of environments create a "perfect storm" for producing terrible online video playback. Poor latency slows down loading the first (and subsequently seeked) frames of a video and variable download speeds force us to wait (sometimes intermittently) for the video to play.

Ensuring video content performs well in these circumstances is crucial for delivering expert video content. To help us do that we've rolled out HLS (HTTP live streaming) as the default video format across all Knowledge Networks. Our aim with using HLS is to mitigate the pain of poor video playback and improve video quality at the same time.

Lets dig in.

What is HLS?

HLS is a protocol designed by Apple to provide a better experience for streaming videos. It achieves this like all adaptive streaming protocols by chopping videos up into segments (usually a couple seconds long) and encoding them at different levels of quality. During this process, a playlist is created which contains the location of all video segments which is used to locate and play the video segments in order.

HLS playlists

Apple - About HTTP Live Streaming

The benefit of chopping a video up into segments versus loading one large video file is so that as a video plays it can dynamically choose higher or lower quality segments. This is the "adaptive" part of adaptive streaming and allows the video to be played back continuously based on varying network conditions.

When the network conditions are poor the video player can decide to try and load a video segment of lesser quality and/or of a smaller video size (resolution) to ensure things keep running smoothly. This the core benefit of using HLS and we're delighted by the difference its had on the delivery of video content.

Delivering high resolution video content

Although a lot of the benefits of adaptive streaming are clearer to users viewing a video on a poor network connection. The benefits are not lost to those on superior ones. We've not just scaled videos down, but we've scaled them up too.

In the past, the maximum size for a video was 960 x 540. Going forward we now encode all videos up to 1920 x 1080 at near HD quality. Try playing a video in full screen and you should see the video progressively swap out the smaller sized video with a higher quality one.

960px HLS
Video playing at original size (loading video-960 segments at quality level 4)
1920px HLS
Video playing in fullscreen (loading video-1920 segments at quality level 4)

To achieve this we encode each video size at several quality bands. The single video you upload is encoded into 10+ different formats to ensure there's always one available for every user on any connection. So go ahead, upload your best expert video content and know that where possible it’ll be fast for everyone. Small screens to big, megabyte connections to gigabyte ones.

p.s Given that videos are no longer one large file but several individual video segments we can now use a CDN to serve each segment to you quicker than before. (To view more about this, check out a previous article about image optimisation).

Go to the profile of Karl Freeman

Karl Freeman

Head of Engineering, Zapnito

3 Comments

Go to the profile of Max Inchcoombe
Max Inchcoombe 7 months ago

Great illustrations Karl! Much easier to visualise an otherwise complex process

Go to the profile of Charles Thiede
Charles Thiede 7 months ago

Great article Karl - short and sweet and useful! As video becomes more and more important to knowledge delivery, it is good to see this work in writing.

Go to the profile of Jen Thoroughgood
Jen Thoroughgood 7 months ago

Thanks Karl. I knew HLS was a good thing for us to do but now I properly understand what it is!