[whatwg] HTML5 video <source> dimensions and bitrate

Zachary Ozer zach at longtailvideo.com
Tue Aug 10 09:35:54 PDT 2010

On Mon, Aug 9, 2010 at 8:05 PM, Silvia Pfeiffer
<silviapfeiffer1 at gmail.com> wrote:
> Have you looked at the @media attribute? I would suggest to put them there.
> As that's not currently specified in media queries, you might want to
> demonstrate how it could work and make a proposal to extend the media
> queries.

I thought about suggesting something like bitrate a bandwidth to media
queries. The syntax would look something like:

<video width=720>
<source src="video-480.mp4" media="(width:480px) and (min-bitrate:2mbps)">
<source src="video-720.mp4" media="(width:720px) and (min-bitrate:4mbps)">
<source src="video-1080.mp4" media="(width:1080px) and (min-bitrate:20mbps)">

The problem is that the user agent would have to then know what
bitrate can be supported between you and that source. User agents
don't currently keep track of this information (so far as I'm aware),
and even if they did, it's highly variable based on your location, the
website you're visiting, etc.

Additionally, while media queries do help content producers specify
which resource would be selected for a device under ideal
circumstances, it doesn't really allow for degradation. However, if
you look at what's out there today, it's pretty common to allow users
to switch to a degraded experience as needed.

I can think of a few solutions that might make sense here:

 * Allow source sub-elements / groupings and provide a call to switch
between elements of a group. Ideally, this would look something like:

<video width="720px">
<sourcegroup type="video/mp4" media="screen and (device-aspect-ratio: 16/9)">
<source src="video-1080.mp4" meta="width:1920px;height:1080px;bitrate:20mbps;">
<source src="video-720.mp4" meta="width:1280px;height:720px;bitrate:4mbps;">
<sourcegroup type="video/mp4" media="screen and (device-aspect-ratio: 4/3)">
<source src="video-480.mp4" meta="width:640px;height:480px;bitrate:2mbps;">
<sourcegroup type="video/ogv">
<source src="video-480.ogv" meta="width:640px;height:480px;bitrate:2mbps;">
<source src="video-720.ogv" meta="width:1280px;height:720px;bitrate:4mbps;">
<source src="video-1080.ogv" meta="width:1920px;height:1080px;bitrate:20mbps;">

 * Have user agents keep track of information about dropped frames.
Publishers could then list multiple valid sources in order of rank.
When the dropped frame rate increased, either the user agent or a bit
of JavaScript could remove that source and re-run the resource
selection algorithm.

On Mon, Aug 9, 2010 at 8:23 PM, Chris Double <chris.double at double.co.nz> wrote:
> Since your player is already JavaScript is having a JS object holding
> the URL, dimensions and bitrate not an option?

This is probably what we'll end up doing for now, however, it would be
nice to be able to parse this data out of the <video> tag.

> How are you working out the current playback rate to decide when to
> switch to a different bitrate version? Is having an attribute of the
> media element that contains this information useful?

It would be useful for the initial selection. See


Zachary Ozer
Developer, LongTail Video

w: longtailvideo.com • e: zach at longtailvideo.com • p: 212.244.0140 •
f: 212.656.1335
JW Player  |  Bits on the Run  |  AdSolution

More information about the whatwg mailing list