By
John Gruber recently wrote up an article titled Why the HTML5 ‘Video’ Element Is Effectively Unusable, Even in the Browsers Which Support It
He’s mostly upset that browsers don’t respect the autobuffer attribute. Or, really, that browsers autobuffer by default. Safari and Chrome do apparently autobuffer by default, but he incorrectly says that Firefox does as well. Just to be clear: Firefox does not autobuffer by default, nor does it autoplay by default. I’m not sure how his testing led him to believe that it does, but I wrote up some examples to show that it does not. Here are three examples:
- Video test without the autobuffer attribute. (Load this first to avoid caching issues!)
- Video test with the autobuffer attibute.
- Video test with one of each.
The best way to test this is to load your favorite browser and clear its cache. Then load your favorite network monitor. Then load the page without the autobuffer attribute set. You can see how much bandwidth the browser is actually using via your external tool.
Of the browsers I tried, only Firefox gives useful feedback on how much is actually buffered as part of its native control set so you have to go to external tools to be able to tell what’s going on with anything else. If you load the page with two videos – one with autobuffer set and one without – you can mouse over them in Firefox and see how one has buffered and one hasn’t.
The video on that test page is pretty big – around 115mb – so you can really tell when it’s buffering even on a fast network.
Here’s what my testing shows:
- Safari for desktops downloads a lot of data. (I don’t have an iPhone so I can’t test that.)
- Chrome downloads a lot of data.
- Firefox loads a small amount of data and then stops.
- Update: According to Philip Jägenstedt, Opera will also do what Firefox does when they include open video support.
This is consistent with what I know about Safari. I talked with one of the Apple WebKit engineers a few months ago and he said that Safari for desktops buffered by default and said that Safari for mobile does not.
There might be some confusion because Firefox does make a couple of network requests when you include a video tag. This is done for two reasons:
- To get the first frame of the video and it’s size. It will only download a small part of the beginning of the video to get the first frame and then stop downloading.
- If your server supports byte range requests, it seeks to the end of the video to try and determine the duration of the video. If your server doesn’t support byterange requests, we don’t get the duration. (Ogg was originally designed as a format for streaming, not static files and as such doesn’t include duration information in the header of the file, although there is work underway to add this functionality.)
If you want to get a sense of how Firefox uses bandwidth, try this bandwidth test I wrote a few months ago. It uses a Firefox-only feature to read progress information on a video as it’s downloaded and give you a rough sense of the amount of bandwidth that particular video element is using. It shows a little traffic when you load the video and then shows how it starts using bandwidth once you press the play button.
But this shows that we understand John’s point of view and we made the decision not to auto buffer by default for the very reasons he points out.
About Christopher Blizzard
Making the web better, one release at a time.
30 comments