It’s been almost three years since HTML5 entered the mainstream. January 2010 was “month zero” for the HTML5 boom. We thought that this would be a good time to take a look at how it’s been doing.
Table of Contents
Feature Implementation Progress
The very good news is that HTML5 and CSS3 implementations across all major browsers on desktop and mobile have become increasingly convergent. The chart below shows the progress of HTML5 feature implementation across major desktop and mobile browsers in the last three years using the HTML5test.com scoring methodology.
While it’s possible to quibble with the specifics of HTML5test’s methodology (we think too few points are given for CSS features), the overall message is clear: HTML5 features have been rapidly adopted by all major browsers – with Internet Explorer’s progress on both mobile and desktop being particularly impressive. The feature implementation ramp from IE8 in 2010 to IE9 in 2011 to IE10 this year has been very steep.
Resolution of Browser Disagreements
In addition, we’ve been mostly happy with the way that the standards process and browser makers have navigated disagreements. The way that the CSS Working Group worked through the issues over gradient syntax and functionality is a great example of standards going right. Originally implemented in WebKkit, the original gradient syntax merged both linear and radial gradients into a single property, and that didn’t work well generally for flexible layouts. Mozilla implemented a different and superior syntax and won the argument that their version was better. The Mozilla version is now the standards-track implementation.
“One of our roles is to make new technologies usable cross-browser from a single API years before it’s possible in the browsers themselves.”
The web database standards process also shows how standards setting can work well. WebKit browsers originally shipped a copy of the SQLite — an embedded relational database — and then proposed “WebSQL” as a specification to standardize it. Mozilla objected to its standardization on the grounds that the SQL 92 standard was a poor basis for a web standards technology, and that an implementation (SQLite) shouldn’t be the basis for standard. As a result, WebSQL standardization was abandoned in favor of a new database standard, IndexedDB which is now the standard database of record for all major browsers. Firefox, IE and Chrome now support IndexedDB on the desktop. Chrome for Android is the first browser to support it on mobile devices.
While we were and continue to be believers that we need built-in relational data handling in the browser, at least we can look forward to a standardized database as a foundation in the future.
W3C Standards Progress
Observers new to the web standardization process sometimes assume that a technology can’t be used until it achieves “final standard” status. This is often used by HTML5-bashers to claim that HTML5 is not ready, but standards status is often only loosely related to dependability or usability. Take the example of XMLHttpRequest, the foundation of AJAX, which exploded into wide use with the release of Google Maps in 2005; it didn’t become a Candidate Recommendation until August 2010! And then, it was merged directly back into the version 2 draft standard without ever reaching Proposed or Final Recommendation.
Luckily, frameworks like Sencha are there to abstract away differences in implementations while standards work progresses. One of our roles is to make new technologies usable cross-browser from a single API years before it’s possible in the browsers themselves.
W3C technologies go through a four stage process: Working Draft, Candidate Recommendation, Proposed Recommendation, Recommendation (Standard). The number of technologies that have ever made it to final Recommendation is very limited due to the inclusiveness and heavy emphasis on consensus in the W3C.
Fortunately, most technologies can be reliably used once they reach the Candidate Recommendation stage. Candidate recommendation signals that the spec is stable enough to support the deployment of two independent implementations.
A long list of major HTML5 technologies has now reached advanced stages of standardization. Here is a list of just some of the big technologies in advanced standardization status with the date of the most recent standard:
- CSS Multi-column (2011)
- CSS Flexbox (2012)
- CSS Values & Units 3 (2012)
- CSS Backgrounds and Borders 3 (2012)
- CSS Images & Replaced Content 3 (2012)
- CSS Style Attributes (2010)
- Web Storage (2011)
- Web Sockets (2012)
- Web Workers (2012)
- Web Messaging (2012)
- Touch Events
- Geolocation (2012)
- CSS Media Queries (2012)
- CSS Selectors 3 (2011)
- CSS Namespaces (2011)
- CSS Color 3 (2011)
- Media Fragments (2012)
- SVG 1.1 (2nd Ed) (2011)
In addition, solid progress is being made on next generation features like blending & compositing, a unified animation model, and content flow across multiple regions within the W3C standardization framework.
The Progress Report
HTML5 progress has not been without its hiccups. Android 3, for example, had an embarrassingly bad browser implementation. Device APIs have been too slow to arrive, and the performance and correctness of CSS 3D transforms are still fairly imperfect. But, this is small potatoes.
We now have five modern HTML5 browsers to choose from, all with very complete HTML5 implementations. Their APIs are based on publicly accessible, patent-free specifications. And, we can depend on these APIs for 10+ years — as long as any Enterprise application needs to last. It’s been an incredible three years for HTML5, and we’re looking forward to more great stuff in 2013.
Jay Garcia says
Awesome article. I like the fact that you drive home the idea of dependability.
Nice to see IE advancing up the chart, too. When it comes to advancing browser standards and what customers can then expect from their web apps I say the more browser pile-on the better.
Fridrich Doe says
Why you omitted Opera?
Michael Maier says
John Doe says
Because Opera sucks LOL
Michael Maier says
@John Doe … Cause it isn’t american?
Michael Maier says
Opera Desktop scores 428, and Opera Mobile 418 on html5test.com.
Michael Mullany says
I created these graphs by researching release dates then loading HTML5 test into every browser released in 2010, 11 & 12. I just tested one browser per year although there were multiple releases from some browsers in each year – and I had to pick one. I did this a while ago, but I do remember it wasn’t straightforward to find some releases. Opera fell off the list of work to do because it’s the #5 browser – although no slight intended – it’s a tier 1 browser for Ext JS.
There are a few things missing in your graph/article so it would make sense:
* The data in a tabular form. (so other people can built upon it.)
* Each browser (version and build number) tested and their release date.
* The release date of html5test, you have used for the test. (html5test evolves too)
Can you add data for Opera please ?
Steven Brent says
As you say, Michael — targeting Candidate Recommendation and up *should* provide a consistent experience across platforms. I am surprised to see the disparity in HTML5 support / performance between mobile browsers built on the same frameworks. On my Android tablet, the (Webkit-based) Dolphin browser scored significantly higher than Chrome (also Webkit, of course) on the HTML5Test.com site. This is anecdotal, obviously, but still interesting. Dolphin also scored slightly better in the JS arena (according to the Octane benchmark, at any rate). I haven’t yet done any comparative tests to see how Sencha framework-based applications perform across these two browsers, or if there is any correlation between the browsers’ inherent performance and that of the applications.
Michael Mullany says
@steven brent – I believe that dolphin turns on a bunch of experimental/canary features in the underlying Android UIWebView that are not turned on by default in regular Android browser and that’s how it gets a better score.
@karl – here are the raw data
Desktop 2010 2011 2012
IE IE8 IE9 IE10
Chrome Chrome 6 Chrome 16 Chrome 21
Firefox Firefox 3.6 Firefox 4 Firefox 14
Safari Safari 4 Safari 5.1 Safari 6
IE 42 138 319
Chrome 291 396 437
Firefox 188 298 345
Safari 319 317 376
Mobile 2010 2011 2012
iOS iOS4 iOS5 iOS6
Android Android 2.3 Android 4 Chrome fA
Blackberry BB 7 Playbook 1 Playbook 2
Windows Win Phone 7 Win Phone 7.5 Win Phone 8
iOS 189 280 371
Android 203 324 360
Blackberry 273 285 393
Windows 25 138 300
Steven Brent says
@Michael Mullany — that sounds about right….
Kazuhiro Kotsutsumi says
I translated it into Japanese.
Provision: Japan Sencha User Group
opera is actually a good application, perhaps because unfamiliarity only way to apply
Tidbits of Experience says
When a small youngster makes one thing for his
mom or grandpa, it is appreciated method past its precise
worth. An even bigger gift usually carries more value than a small one.