Browser makers hope WebGL will remake 3D

Don't believe WebGL is real? Here's how to try the 3D browser technology yourself. It works, but plenty of development is needed for this graphics foundation to mature.

This WebGL demo shows 3D Collada files--in this case a Spore video game creature.
This WebGL demo shows 3D Collada files--in this case a Spore video game creature. Screenshot by Stephen Shankland/CNET

If you want to see the scale of browser makers' ambition to remake not just the Web but computing itself, look no farther than a new 3D technology called WebGL.

The WebGL vision is simple. You're running around in a video game universe, blasting radioactive aliens--but you got there by visiting a Web site, not by installing the game on your PC.

This sort of computationally demanding chore contrasts sharply to with today's Web, whose top-notch programmers strain to reproduce bare-bones versions of the rich capabilities open to applications running natively on a computer.

WebGL, while only a nascent attempt to catch up, is real. WebGL now is a draft standard for bringing hardware-accelerated 3D graphics to the Web . It got its start with Firefox backer Mozilla and the Khronos Group, which oversees the OpenGL graphics interface, but now the programmers behind browsers from Apple, Google, and Opera Software are also involved.

Perhaps more significant than formal standards work, though, is WebGL support in three precursors of today's browsers--Minefield for Mozilla's Firefox, WebKit for Apple's Safari, and Chromium for Google's Chrome. Opera has started implementing WebGL, too, said Tim Johansson, Opera's lead graphics developer.

With a little tinkering--check the instructions and caveats below--you can give it a whirl, too. Overall, I was favorably impressed with the technology.

CNET News Poll

Will you use WebGL?
Browser makers are building 3D technology into their products. Will you use it?

Yes, bring on the 3D Web
I'll stick with Flash graphics
Skip it. Direct3D is the way to go
Google's O3D looks better
Yuck. More spinning cubes?



View results

Its performance certainly isn't enough for a competitive first-person shooter, but it's approaching utility for casual gaming. And because of how WebGL elements can be integrated with the rest of a Web site's code, it's got some advantages.

What is WebGL?
WebGL is one of a handful of efforts under way to boost the processing power available to Web applications. It marries two existing technologies.

First is JavaScript, the programming language widely used to give Web pages intelligence and interactivity. Although JavaScript performance is improving relatively quickly these days in many browsers, programs written in the language are relatively pokey and limited compared with those that run natively on a computer.

Second is OpenGL ES, a 2D and 3D graphics interface for devices such as phones or car navigation systems with limited horsepower. If a computer's graphics system has an OpenGL driver, software written to use OpenGL can tap directly into the graphics system's hardware acceleration.

WebGL links these two so JavaScript programs can call upon 3D abilities, with the HTML5 technology also under development acting as glue.

However, although OpenGL is a reasonably well established technology in graphics circles, it's a different beast for most JavaScript programmers. That means that just building support for WebGL into browsers isn't enough to establish the technology; programmers also must learn WebGL.

"WebGL is a very low-level API [application programming interface], so it's not for the faint of heart. OpenGL's shading language, GLSL, is itself an entire programming environment. So doing even simple things in WebGL takes a lot of code," said WebKit programmer Chris Marrin in a blog post.

How to try it
The Khronos WebGL demo page offers several pages to kick the WebGL tires. But first you'll have to get WebGL working.

First, you'll need to install the test versions of the browsers that become Safari, Chrome, and Firefox. Follow the links to download the nightly build of Safari's precursor, WebKit or the nightly "Minefield" build for Firefox. For those who want to use Chrome's precursor, Chromium comes in flavors for Windows, Mac OS X, 64-bit Linux and 32-bit Linux.

Rotating a cube with cute puppy images can give a dual-core PC a workout.
Rotating a cube with cute puppy images can give a dual-core PC a workout. Screenshot by Stephen Shankland/CNET

Once you've got one of these browsers installed--and be warned that these works in progress aren't fully tested or supported--you'll have some tweaking to do, because in none of them is WebGL enabled by default.

I found it easiest to install it on Minefield, the only one of the three with a point-and-click-friendly method. In the address bar, type "about:config" and click through the "I'll be careful" warning that you're meddling with the browser's innards. In the "Filter" box, enter "WebGL" and search for an item named "enabled_for_all_sites." By default, its value is false right now; double-click it to make switch it to true.

For Safari on Mac OS X, open the Terminal application (it's in the Applications/Utilities folder) to get yourself a command line. Type this: "defaults write com.apple.Safari WebKitWebGLEnabled -bool YES" then hit return and restart WebKit. (Note that it's got the same icon as Safari, but with a gold rim around the compass.)

For Chromium, you'll have to use a command-line switch, too. On Windows, first locate the Chromium icon in the Start Menu and right-click on it. In the "target" field you should see the full location of the file; it's "C:\Documents and Settings\stephens\Local Settings\Application Data\Chromium\Application\chrome.exe" in my case. Add "--no-sandbox --enable-webgl" to the end of the address, outside the quotation marks. Save the change, then launch the browser.

For Chromium on the Mac, open Terminal to launch Chromium with the switches. After some trial and error I found this did the trick: /Applications/Chromium.app/Contents/MacOS/Chromium --no-sandbox --enable-webgl

To run WebGL in Chromium, you have to bypass the sandbox mechanism that makes attacks harder by confining processes to regions called sandboxes. That's got risks, so it's best to drop back into the normal mode without the "--no-sandbox" switch when you're done. Google is addressing this issue, though.

"We are working to make WebGL work in Chrome without the user having to disable the sandbox. It's a lot of work, but we're making fast progress on it," said Matthew Papakipos, a Google engineering director.

One you're done, start trying the demonstrations. Be warned, though, that not all the demos work on all the browsers. And perhaps because the specification as well as the browsers are a work in progress, some other WebGL demos wouldn't work for me on any browser.

What's it like?
If you don't want to suffer the slings and arrows of pre-production software, here are my thoughts about my testing.

Overall, I'd say WebGL has potential. It's certainly not blazing fast, but it can spin 36 shaded miniatures of Earth and Mars at 60 frames per second on an Apple MacBook Pro.

These test results show the frame rate on a MacBook Pro running the latest builds of Chromium, Minefield, and Safari. The test shows a spinning 3D Earth and Mars.
These test results show the frame rate on a MacBook Pro running the latest builds of Chromium, Minefield, and Safari. The test shows a spinning 3D Earth and Mars. Bear in mind this is only one test of pre-production software. Stephen Shankland/CNET
A view of the spinning globes demonstration.
A view of the spinning globes demonstration. Screenshot by Stephen Shankland/CNET

Some of the demos taxed my dual-core machines' processors, and they were hardly anything eye-popping. But there were differences in the three browsers' abilities.

WebKit seemed to handle WebGL with the least strain; its animations ran with significantly higher frame rates than Minefield or Chrome. I wouldn't judge or praise any of them too dramatically at this early stage and on limited benchmarks, though.

So what's it good for besides casual games at this stage? Not much--perhaps a little eye candy here and there, 3D models of products you're thinking of buying online, and mapping and virtual-world applications.

But as with many technologies, it's important to lay a foundation on which future developments can be built.

I've been underwhelmed by 3D in general. It's fine for many games, though those aren't typically my cup of tea. But given that my brain works in 3D, I've been disappointed in how little interfaces in operating systems and conventional software have been able to take advantage of depth as well as height and width.

However, I fully expect in the glorious future, 3D will arrive for real in displays, not just the flattened 2D versions of depth we see today. Combine that with multitouch and gestural interfaces that interpret my hand-waving and eye movements and things start getting pretty sci-fi.

It's not clear that Google's Chrome OS vision will conquer the world and the browser will be the universal application foundation. It is clear, though, that there are plenty of Web applications today, that there will be more tomorrow, and that they'll need better interface technology.

With most of the browser backers pushing it and graphics hardware increasingly common, WebGL has serious potential.

Not the only game in town
JavaScript has been streamlined with widely used libraries such as the Dojo Toolkit, jQuery, the Yahoo User Interface (YUI) library , and most recently, Google's Closure Tools . Packaged in a similar way, WebGL could be made more approachable for some tasks, too.

That's where another 3D Web technology, a Google browser plug-in called O3D, could be a factor. O3D, still under development, provides a higher-level 3D graphics interface. It could be rebuilt out of WebGL components, though, and Google believes that eventually will happen.

"It's an interesting idea, but we haven't done this so far. It's definitely possible to create higher level retained-mode renderers (like O3D) that are implemented on top of WebGL, and we expect that this will likely happen at some point," Google's Papakipos said. "There are potentially some performance issues, but we're working to resolve those by making some changes to V8," the Chrome browser's JavaScript engine.

Gregg Tavares, a Google O3D programmer and longtime game developer, detailed some of those performance issues in a mailing list posting. "WebGL is a very cool initiative but it has a lot of hurdles to overcome," he said. "JavaScript is still slow in the large scheme of things. Maybe at sometime in the future WebGL will have added enough features over basic OpenGL to be more powerful or JavaScript will have gotten a few orders of magnitude faster but at the moment..."

One WebGL test shows 36 spinning planets.
One WebGL test shows 36 spinning planets. Screenshot by Stephen Shankland/CNET

The Windows connection
Another hurdle to be overcome is OpenGL driver support on graphics cards. High-end cards found in professional workstations support it, but for mainstream Windows machines, Microsoft's Direct3D is a more common interface to accelerate 3D graphics.

WebGL dovetails with OpenGL, but it's possible to link to Direct3D, too, said Arun Ranganathan, chairman of the WebGL working group and standards evangelist at Mozilla. "There's no technical impediment to running on Direct3D. We've been careful so we don't introduce such impediments," Ranganathan said.

Added Vladimir Vukicevic, a Mozilla programmer who's been leading the WebGL charge, "On Windows the Direct3D drivers are often higher quality than the OpenGL drivers."

Of course, there's more to the world than Windows. Khronos Group spokesman Jonathan Hirshon pointed out that smartphones ship with OpenGL ES; the iPhone 3GS supports version 2.0.

Microsoft didn't comment on its plans for WebGL. It isn't a member of the Khronos Group, but of late it's been looking more favorably on Web standards when it comes to Internet Explorer's design.

Adobe Systems' Flash, too, has some 3D support, and it's widely installed. "It would be great if they [Adobe] were to implement WebGL in AIR or Flash," Vukicevic said. That could help spread the technology to Internet Explorer users, he said.

The biggest competitor, though, is doing 3D in a regular operating system. There, programming tools are more mature, hardware support is more consistent, performance is better--and the industry has hardly stopped advancing.

For WebGL to truly meet its potential, browser makers will have to convince programmers to adopt a new way of working. The Web has plenty of advantages in usage and ubiquity, but it has a way to go before it can match many native operating system abilities.

About the author

Stephen Shankland has been a reporter at CNET since 1998 and covers browsers, Web development, digital photography and new technology. In the past he has been CNET's beat reporter for Google, Yahoo, Linux, open-source software, servers and supercomputers. He has a soft spot in his heart for standards groups and I/O interfaces.

 

Join the discussion

Conversation powered by Livefyre

Show Comments Hide Comments