Preview of WebKit's WebGL / Canvas 3D

Yesterday, I was updating my local checkout of WebKit and I noticed a few tests for "WebGL" scroll by (view commit). Apparently, a big WebGL patch has quietly landed. With a name like "WebGL", I couldn't help but investigate.

What is WebGL?

WebGL is basically an initiative to bring 3D graphics into web browsers natively, without having to download any plugins. This is achieved by adding a few things to HTML5, namely, defining a JavaScript binding to OpenGL ES 2.0 and letting you draw things into a 3D context of the canvas element.

What does that mean exactly? Here's a video of the initial WebGL layout tests included in WebKit r48331. Be sure to watch them in HD!

These demos are very simple, but they're a great start. I'm sure we'll see some complicated OpenGL scenes pop up soon, and I'm curious to see how complex they can get before FPS becomes a factor. Maybe I'll make a WebGL mini-game in some spare time!

Why is this cool?

This has a million applications - I'm obviously biased towards gaming though. Basically, imagine playing Lugaru or Black Shades instantly in your browser, on any platform, without having to install anything. In the same way Gmail is killing desktop mail applications, full-fledged 3d video games could start migrating to the web.

Flash gaming would have a serious run for its money as more advanced, standards-based, hardware-accelerated games started popping up. This would have huge implications for the entire PC gaming market, which I might explore in a separate blog post.

Of course, this utopia of browser-based OpenGL gaming will require the cooperation of all major browser vendors. When will we start to see WebGL outside of isolated, developer previews?

When can we actually use it?

This is a brand new web technology, we won't be seeing this for another 10 years right? Well, this actually has the potential to show up in browsers in the not-so-distant future. As you've seen above, this is already significantly developed in WebKit. It will take a little while before it's enabled by default in the nightly WebKit builds and longer still for Safari to adopt it, but that could theoretically be as soon as six months from now.

The same goes for Google, FireFox, and Opera, who are part of the WebGL working group. Google Chrome, of course, is based on WebKit and has pledged to support this (in addition to its own O3D, which hopefully will be standard soon as well). FireFox has an extension which enables an implementation of Canvas 3D, and Opera has supported its own (albeit different style) canvas 3D for a while.

What about Internet Explorer, which hardly supports existing standards, let alone up and coming ones? Given Microsoft's history, I wouldn't hold my breath, but there will undoubtedly be some kind of extension that simulates WebGL, like there is for the canvas element. Until then, it will be yet another awesome WebKit feature for people who are developing specifically on the WebKit platform to brag about.

It will be pretty cool when Awesomium updates to the latest WebKit and we can render 3D scenes inside of our own 3D scene!