In prepping for a presentation, I began thinking about how to best analyze the HTTPArchive on streaming video. The ‘interesting stats’ page shows that 25% of the average webpage is video:
Obviously, not all websites have video, and this large percentage is because humongous files (like video) throw off averages (see “Bill Gates walks into a bar“).
I am interested to see how video streaming is handled on the web. HLS streaming is delivered through chunks of video that are played sequentially. I’ve written a bit on how HLS streaming works with adaptive bitrate in the past.
The gist of it is that the first file in a video stream is a manifest file (with extension m3u8) This file tells the player in the browser (or in the app) what bitrates are available, and then the player selects the appropriate stream for the device and the available network conditions. I’ve looked at a small number of manifests in the past, but was curious on a larger study.
Data Collection
To gather a larger dataset, I ran a quick query in HTTPArchive to look at the top 10,000 sites:
select
pages.rank, pages.url, requests.url, ext
from httparchive.runs.latest_requests_mobile requests
join(
select rank, pageid, url
from httparchive.runs.latest_pages_mobile) pages
on pages.pageid = requests.pageid
where ext = “m3u8”
order by rank asc
This gives me a list of files with extension m3u8. To read and understand these files, I copied the column with the filename into a text file and saved it as 10k_m3u3.txt. I can then curl all of these files to my computer for analysis:
xargs -n 1 curl -O < 10k_m3u3.txt -m 5
Inside each manifest file is a list of available streams. They are each listed on a line, and the lines look like this:
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=513000,RESOLUTION=480x270 http://c.brightcove.com/services/mobile/streaming/index/rendition.m3u8?assetId=5733787565001&pubId=4841592010001&videoId=5733185801001
Since they all have this format, I can search the files for how many different bandwidth profiles exist across all of the streaming files:
grep -c ‘#EXT-X-STREAM-INF’ *.* | grep -v :0
master.m3u8?videoId=5734164478001:6
This results in 98 streams in the top 10,000 sites, and 237 videos in the top 1M sites.
This tells us that 41% of websites with HLS video streams are in the top 10,000 websites.
Moving ahead with the full data set, we can identify how many bitrates are available per video stream:
40% of HLS videos have 6 bitrates available for streaming (it is the average/median and mode in this data set). Let’s see what we can learn about these bitrate resolution combinations.
To get bitrate and resolution information for each of these streams, I grepped just these values from the files:
grep -o “[^-]BANDWIDTH=[0-9]*[^.*]RESOLUTION=[0-9xX]*” *.*
This regular expression grabs just the BANDWIDTH=(number) and RESOLUTION=(number) for each instance that both occur on the same line.
the [^-] ignores any -BANDWIDTH terms (since there is occasionally an “AVERAGE-BANDWIDTH reported).
the [^.*] allows for any number of characters between the 2 terms, and ignores them all.
[0-9]* allows for any length number, and [0-9xX]* is any number and ‘x’ combination – e.g. 1280×720
The resulting list is 1065 different streams that are available from 191 videos. (A few videos dropped out of the sample for not having resolution AND bandwidth values).
Video Resolutions Observed
There are 42 video resolutions specified in the data:
The 6 most popular are identified below:
You might be wondering – how can there only be 4 top resolutions, when the data shows that each stream averages 6 different bitrates? It turns out that many streams use the same resolution, but change other parameters (like encoding, or frames per second) that affect the bitrate. The following chart has an x-axis of resolutions for each video, and the y-axis is the count:
There are 260 video/stream combinations that utilize the same resolution twice. (And 3 that use the same resolution 3x, and one each of 4, 5 and 6).
Video Aspect Ratios:
988 (93%) of the streams are 16:9; 57 (5%) are 1:1, and there are a few 4:3 and 3:4 (portrait mode!)
Video Bitrates Observed
There are 585 observed bitrates (!?!) for the 1065 available streams. (over 50% of the streams we are looking at have a unique bitrate).
As expected from the math above, most of the bitrates have a count of just 1. Aggregating the bitrates into 100KBPS chunks is slightly more useful:
The most common bitrates are 600 KBPS, 800 KBPS, 1.0, 1.3, 1.9 and 2.2 MBPS.
If we look at each video, the median minimum bitrate is 500 KBPS, the median maximum is 2.1MBPS, and the median median bitrate is 1.14 MBPS.
Stream Startup
In HLS, the player chooses the first stream in the manifest to initiate streaming. In this dataset, we see three different configurations that affect the first stream that begins playing. The first example sorts the video streams bitrate from lowest to highest:
#EXTM3U #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=143000,RESOLUTION=480x270 http://c.brightcove.com/services/mobile/streaming/index/rendition.m3u8?assetId=5731546027001&pubId=4802324433001&videoId=5731535767001 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=204000,RESOLUTION=480x270 http://c.brightcove.com/services/mobile/streaming/index/rendition.m3u8?assetId=5731546028001&pubId=4802324433001&videoId=5731535767001 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=395000,RESOLUTION=640x360 http://c.brightcove.com/services/mobile/streaming/index/rendition.m3u8?assetId=5731543885001&pubId=4802324433001&videoId=5731535767001 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=726000,RESOLUTION=640x360 http://c.brightcove.com/services/mobile/streaming/index/rendition.m3u8?assetId=5731545741001&pubId=4802324433001&videoId=5731535767001 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1024000,RESOLUTION=960x540 http://c.brightcove.com/services/mobile/streaming/index/rendition.m3u8?assetId=5731545848001&pubId=4802324433001&videoId=5731535767001 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1322000,RESOLUTION=1024x576 http://c.brightcove.com/services/mobile/streaming/index/rendition.m3u8?assetId=5731544190001&pubId=4802324433001&videoId=5731535767001 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1686000,RESOLUTION=1280x720 http://c.brightcove.com/services/mobile/streaming/index/rendition.m3u8?assetId=5731545559001&pubId=4802324433001&videoId=5731535767001
The first stream will have bitrate 143 KBPS (480×270 resolution). This means that the video will probably start up quickly (less data has to be transmitted), but will initially be of low quality. We see 75% (144 of 191) streams use the lowest bitrate at startup.
This second manifest sorts the streams from HIGHEST to lowest:
#EXTM3U #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=6656000,RESOLUTION=1280x720,CODECS="avc1.4d001f,mp4a.40.2" 720p.m3u8 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=2748000,RESOLUTION=854x480,CODECS="avc1.4d001f,mp4a.40.2" 480p.m3u8 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1449000,RESOLUTION=640x360,CODECS="avc1.4d001e,mp4a.40.2" 360p.m3u8
With a 6.656 MBPS bitrate and 1280×720 resolution, this video will look really nice – if it ever starts playing. Viewers on a slower cellular network may not have 6.6 MBPS throughput, meaning that this stream will initially try the high throughput stream, but eventually degrade the content to a lower stream. We see 5% of videos use the highest bitrate at startup.
Finally, (this really feels like reading Goldilocks and the Three Bears), this 3rd manifest chooses a bandwidth somewhere in the middle:
#EXTM3U #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=490000,RESOLUTION=480x270,CODECS="mp4a.40.2,avc1.77.30",CLOSED-CAPTIONS=NONE https://videos-f.jwpsrv.com/content/conversions/CUMaVzM5/videos/cfu1vhHW-30635786.mp4.m3u8?token=0_5ab07ecf_0x4003d9b743638b0b4db3ad49ddad3180ba4a6e6f #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=2840000,RESOLUTION=1920x1080,CODECS="mp4a.40.2,avc1.77.30",CLOSED-CAPTIONS=NONE https://videos-f.jwpsrv.com/content/conversions/CUMaVzM5/videos/cfu1vhHW-30635791.mp4.m3u8?token=0_5ab07ecf_0x2a46363f336ec9f2d4de5bc2be30187717531e66 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1370000,RESOLUTION=1280x720,CODECS="mp4a.40.2,avc1.77.30",CLOSED-CAPTIONS=NONE https://videos-f.jwpsrv.com/content/conversions/CUMaVzM5/videos/cfu1vhHW-30635788.mp4.m3u8?token=0_5ab07ecf_0xcad8b0de3796caa3747de339f488cfa21616d73f #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=640000,RESOLUTION=720x406,CODECS="mp4a.40.2,avc1.77.30",CLOSED-CAPTIONS=NONE https://videos-f.jwpsrv.com/content/conversions/CUMaVzM5/videos/cfu1vhHW-30635787.mp4.m3u8?token=0_5ab07ecf_0xd8e7b725b02bee5b0da1e2c484cf02d07b941888 #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=340000,RESOLUTION=320x180,CODECS="mp4a.40.2,avc1.77.30",CLOSED-CAPTIONS=NONE https://videos-f.jwpsrv.com/content/conversions/CUMaVzM5/videos/cfu1vhHW-30635785.mp4.m3u8?token=0_5ab07ecf_0xddc49c219b1ea4088fd162b93272e17bdc08d91a #EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=120000,CODECS="mp4a.40.2" https://videos-f.jwpsrv.com/content/conversions/CUMaVzM5/videos/cfu1vhHW-30635790.m4a.m3u8?token=0_5ab07ecf_0x110c8479c4a1461cbae9c645a9e27f141f1a1eb7
So – what’s going on here? In this case, the streams are listed in highest to lowest order, but the 490 KBPS stream is pulled out of order and placed at the top. By balancing fast startup with better quality video , and give the customer a quick startup with decent quality video. 20% of videos start with a middle streaming value.
95% of video streams starting with a lower bitrate and lower quality video to ensure that the video starts up quickly.
Video Playback on Different Mobile Networks
If your mobile device is on a slow network, what quality video levels do you expect to see? By cross referencing the bitrate data to the resolution data, we can make some guesses. I will use WebPageTest’s definitions of network speeds as my criteria:
EDGE: 280 KBPS
Slow 3G: 400 KBPS
Fast 3G: 1.6 MBPS
Slow 4G: 3 MBPS
4G: 9 MPBS
What we find is that even at 2G, 16% of videos offer a bitrate that could playback on the device. 35% support “Slow 3G”, and once we hit 3G, just about all the videos should stream.
Now, I bet you are thinking to yourself “I bet that video on 2G is pretty low resolution.” And you’d be correct. We can chart how the video resolution will change at these different network speeds:
We can see the video streams move left to right (and grow taller) as the network speed increases, until at 4G, where every video is using their maximum bitrate streams. Speaking of which – what is the best possible quality that these videos can stream?
We can see from this graph that 83% of videos will stream up to 1280×720 or 1920×1080, but that leaves 17% that stream at a much lower bitrate – even when the network can support a higher quality video.
Conclusion
Looking at all HLS streams from the 15/2/2018 HTTPArchive crawl – we find 191 streams on mobile for analysis. The data shows that each video has on average 6 streams of varying bitrate and resolution. It is clear that there is no standardization on video resolutions or bitrates – every site has a different implementation – 42 different resolutions and 585 bitrates were observed.
95% of the videos have made optimizations to startup quickly by leading with a lower (or middle) quality stream. 16% of the videos support a stream that could conceivably run on an EDGE speed network. At high speeds (9 MBPS), 17% of all videos serve lower than 1280×720 quality video – potentially delivering a low quality video to the end user – resulting in a poor experience.
As mobile video continues to grow, its important that developers deliver high quality streaming video to every device, and from this study – we can conclude that many video streams are operating well, but there are also many that could be optimized for better delivery to mobile devices.
Doug Sillars: Performance Expert and Developer Advocate 