With the introduction of WebGL Web browsers became capable of using hardware accelerated 3D graphics, which opened up the possibility of creating a wide range of applications including 3D games.

In this thesis I will investigate how a 3D game engine can be implemented in a browser using WebGL and JavaScript.

First I will take a look at the characteristics of JavaScript and JavaScript engines, by investigating some techniques and software patterns for writing high performance JavaScript, and then examine some of the challenges there are when comes to creating 3D games.

To get hands-on experience I have implemented KickJS – a WebGL based 3D game engine. KickJS is a shader-based engine with a range of built-in shaders. Using the KickJS engine I have also created a shader editor, a scene editor and several small 3D demos.

Finally I have benchmarked the raw performance of JavaScript and WebGL. I have approached this problem from two sides: First comparing JavaScript performance with C++ performance and then seeing how the rendering performance of KickJS compares with the Unity game engine.

In general I found that the JavaScript CPU performance is around 2-4 times slower than C++ based applications. Since much of the calculations are pushed to the GPU, this may not be an issue for small and medium sized games.

The availability of WebGL makes the WebGL browsers a very attractive platform. I expect many small and medium sized games to appear on the platform in the near future.

Download the full thesis here:

WebGL based game engine (PDF 5.3 MB)

A big thanks to Jacob Marner and Simon Mogensen from IO Interactive for their invaluable feedback.