News

+ back to News
March 23rd, 2012

WebGL: Why the Web Will be More Than Just Pages

Blog Post written by Ben Truyman

While hailing a cab in Austin during SxSW might be a daunting task, there certainly is no shortage of interesting new technologies to be explored. For a developer like me, it’s chock-full of panels and presentations discussing everything from techniques to tools for creating exciting new digital experiences.

There were the typical talks revolving around new ways to utilize “today’s” technologies like HTML5 and CSS3 as one would expect. However, one of the more interesting topics I was delighted and surprised to see given so much attention was WebGL. I was surprised because WebGL is so bleeding edge, we may not see mainstream implementations until 2014.

And there was no lack of talent at SxSW waiting to talk about the latest developments of WebGL. We had industry rock stars like the creator of the most popular WebGL JavaScript libary Mr. Doob, Creative Director from Google Aaron KoblinLuz Caballero of Opera Software and Nicolas Garcia Belmonte of Sencha there to teach us all about the power and application of WebGL.

The attention given to WebGL was well-deserved — it’s going to open up some stunning new channels and opportunities developers and designers have been craving for years.

So what the heck is WebGL?

WebGL stands for “Web Graphics Language”. It aims to provide web developers the same types of capabilities that are provided to developers of rich 3D desktop and mobile applications, all within the context of a browser. It exposes unprecedented access to the graphics processing hardware available on most platforms today, directly to web developers. What’s even better is WebGL isn’t a proprietary plugin like Flash or Silverlight that users must install, but rather it’s an open standard just like HTML and CSS.

Before WebGL, web developers relied solely on the processing power of the CPU (central processing unit) on a user’s computer. HTML, CSS, and JavaScript processing all happened in the same shared area of the CPU, making it difficult to create immersive 3D interactive experiences. WebGL solves this scalability problem by opening up access to the computer’s GPU (graphics processing unit), a piece of hardware specifically tuned to handle the types of mathematical challenges posed by high-performance 3D applications.

Examples of WebGL

I think the best way to illustrate the potential of WebGL is through examples. Note, these examples require a WebGL enabled browser which includes recent versions of Firefox, Chrome, or Opera.

ro.me - The canonical example of what can be done with WebGL currently. It’s an impressive interactive 3D music video created by Google and a handful of other groups.

Trigger Ralley (game) - One of the best WebGL racing demos currently available.

WebGL on Android - Sony demos a preview of their hardware accelerated WebGL support added to the Android browser. Remember, this is a full 3D application running in a mobile browser.

WebGL Skin - A demo of an ultra-realistic rendering of a human head. It might sound uninteresting, but the actual implementation is quite impressive.

Industry Impact

WebGL will have a dramatic impact on not only users but content creators as well. The type of expertise and skill set required to execute a rich 3D experience created with WebGL is similar to that of one created on existing desktop 3D platforms. What I find intriguing about this trend is that we’re seeing the front-end development practice being forked in many different directions. Typically when we needed front-end web work to be done, we’d hand it off to a “web developer” and be done with it. With the capabilities provided to us through technology like HTML5 and WebGL, we’re most certainly going to begin seeing more domain-specific roles.

Not Without Some Hurdles

While nearly all desktops and most smartphones on the market today have dedicated graphics hardware and the ability to support a technology like WebGL, there are still some hurdles to overcome. As with any new open standard, like HTML5, the biggest obstacle is often cross-browser support and compatibility. Thankfully, there are already a handful of browsers with great WebGL support. Chrome, Firefox, Opera all have good support for WebGL. Safari has support but it hasn’t been enabled quite yet.

You’ll notice the elephant in the room is, of course, Internet Explorer. While we’ve all been impressed by the progress made by Microsoft to improve their browser’s support for web standards, Microsoft has expressed concerns with implementing support for WebGL in their browser for security reasons. In a blog post, Microsoft explains that “WebGL directly exposes hardware functionality to the web in a way that we consider to be overly permissive”. Microsoft even notes an example attack that could potentially bring a user’s computer down.

Interestingly enough, researchers later found a very similar vulnerability existing in Microsoft’s own Silverlight plugin. I can empathize with Microsoft as their browser has traditionally been a target for hackers due to its lack of security and market share. However, I’d argue that a technology that will drastically change the landscape of what’s possible on the web, like WebGL, should not be so quickly dismissed. In the meantime, there are plugins like Google’s Chrome Frame or IEWebGL that bring WebGL support to Internet Explorer.

WebGL Is Here to Stay

Despite some setbacks, WebGL provides some exciting potential by extending the capabilities of web browsers, making them an even more interesting platform for rich interactive experiences. It’s also exciting to see the line between a web app and a native app being blurred to the point where there may eventually be no distinction. Mozilla has even designed an entire mobile operating system around open web technologies called Boot to Gecko. The continued development of these technologies is making it more and more obvious that the web should be used for more than just pages.