Monster Mesh - A Google Chrome Experiment

Over the past year or so, my contributions to Google Chrome have mostly been behind the scenes: improving our base libraries, security, stability, and performance. But recently, I made an addition to Chrome Experiments, a site we just launched today. With the Monster experiment I had a chance to step back from working deep within Google Chrome's C++ code, and give my right brain a little exercise.

Since web browsers don't currently support native 3D graphics, the basis for my experiment is a custom 3D rendering engine written in JavaScript. It uses some pretty intense numerical computations to project the 3D shapes into a 2D image, like your eye would. These are then drawn to the screen using the HTML5 canvas element. This process is a similar concept to early 3D game engines, before accelerating graphics cards handled the work.

JavaScript wasn't originally designed with intensive mathematical computation in mind; the real trick is not in writing the engine, but making it perform well in the high-level language running in your browser.

Compared to creating the 3D model beforehand and embedding the data in the application, Monster creates the mesh using software algorithms in real time while the demo runs. This has some nice advantages like decreasing download time, but it requires even more processing power to draw every frame.

Here's what it looks like in action:



The demo starts with a simple cube, but as it progresses, the cube is smoothed and pulled apart to become exponentially more complex. The values used in these operations are varied over time, creating an animation that brings the monster to life. Anytime during the demo you can hit 'p' to pause, and explore the scene with your mouse. With a bit of careful programming (ok, a lot) and the performance of V8, it's possible to do all this work and still generate smooth and consistent graphics.

So give it a try and take a look through the other Chrome Experiments on the Google Chrome Blog. If you've made something interesting with JavaScript please submit it, too. We'll be highlighting more experiments and holding sessions Google Chrome at Google I/O on May 27 - 28 in San Francisco.

By Dean McNamee, Google Chrome Team