Application Development: WebGL

A lot of cool technologies are coming from non-web world to Web Application Development. One of the most excited examples is WebGL [https://www.khronos.org/webgl/]. It’s a free web standard to use low-level 3D graphics right on the page via canvas element. It’s based on OpenGL ES 2.0 and has similar development approaches. To test if your web browser supports WebGL just go to http://get.webgl.org/. Almost all modern browsers and platforms support WebGL. It doesn’t need special plugin like Flash player or Unity.

The Platform

As WebGL is a cousin of OpenGL, it’s a cool 3D engine and 3D Application Development platform. WebGL is mostly used in Game Development and media projects. Nowadays, both the desktop and the mobile hardware is powerful enough to support GL technology to be runned into the browser. That’s why so many games are implemented as JavaScript solutions based on WebGL instead of well-known Flash. I’m not going to mark Flash as dying technology, but, objectively, WebGL is the future of the Application Development in rich web media and interactive animation.

 Features and approaches

It needs to have good 3D math skills to understand GL concepts and actually use it. Regular WebGL applications consist of 2 kinds of code. There are main JavaScript logic and shaders. Last ones are special standardized snippets runned by GPU. The code of shaders have to loaded in some way, then compiled and applied into the engine before usage. The engine is used to process 3D primitives and plenty of settings into a model to be rendered to view on screen. It can do it in very efficient way with pretty huge and complicated model. As it’s used in Game Development, the criteria is to be able to render the scene with frequency 30-60 frames per second. Even in case of 2D game, it would be more efficient to use WebGL, because of GPU power involved into the rendering process.


Any serious WebGL project has 2 main directions of work. On the one hand, the framework should be designed, implemented and tested well. Then application should be developed by the elements of the framework. From time to time it needs to add some new feature to the framework. Besides, the same framework may be used to implement all games of a studio or even sold to another company. This is very reasonable approach, because pure GL level is very low. It’s like an assembler for 3D application development. To solve this problem there are plenty standard de facto libraries widely used in WebGL case. Three.js [https://github.com/mrdoob/three.js] is the most used JavaScript 3D framework. The main idea of the project is to provide easy to use interface for developers and several renders, e.g. render for WebGL. In this way, game developers are able to concentrate on the actual project instead of pure technical routine. There are other frameworks available, as well. E.g., babylon.js [http://babylon.js/], turbulenz.com [http://turbulenz.com/]. Those can be good alternative.

Read also

Comments are closed.