Programming 3D Applications with HTML5 and WebGL

Chapter 2. WebGL: Real-Time 3D Rendering

WebGL is the standard 3D graphics API for the Web. It allows developers to harness the full power of the computer’s 3D rendering hardware from within the browser using JavaScript. Before WebGL, developers had to rely on plugins or native applications and ask their users to download and install custom software in order to deliver a hardware-accelerated 3D experience.

While WebGL is not in the official HTML5 specification, it is shipped with most browsers that support HTML5. Like Web Workers, WebSockets, and other technologies outside the official W3C recommendations, WebGL comes with the package; the developers at Google, Apple, Mozilla, Microsoft, Amazon, Opera, Intel, and BlackBerry consider 3D an essential component for making the browser into a first-class application platform.

WebGL works on the majority of desktops, and almost all mobile browsers.^[1] There are millions of WebGL-enabled seats already installed, most likely including the machines you run at home and in your office. There are numerous sites under development, with applications including games, data visualization, computer-aided design, 3D printing, and consumer retail.

WebGL is a low-level drawing API: you supply it with arrays of data and a shader, and tell it to draw. Anyone used to a graphics API like the 2D Canvas will find the lack of high-level constructs mystifying at first. However, there are several open source JavaScript toolkits that provider higher-level access ...