HTML and CSS Reference
In-Depth Information
Chapter 18
HTML5 Games in C++ with Emscripten
Chad Austin, Senior Technical Director, IMVU
If you had told me ten years ago that I'd someday compile real-time, 3D C++ games into JavaScript so I could run them
in web browsers, I would have thought you were crazy. Since then, software has shifted from retail stores and optical
discs to online app stores and web applications. Internet users have become increasingly security-conscious, and
JavaScript engines have gotten faster by orders of magnitude.
The Web is the ultimate platform. It is secure: applications have no direct access to the local machine. It is
seamless: users merely have to click a link to experience your game or web site. It is royalty-free: if you can host a web
page, you can distribute a web app. It is capable: with the advent of HTML5 and WebGL, web applications have access
to an increasing set of functionality, such as gamepads, full screen display, and local storage. And now, the web is fast
too: with the advent of technologies like Mozilla's asm.js and Google's Portable Native Client, web applications can
approach native performance.
Compiling code to JavaScript is not new. Google's GWT compiles Java into JavaScript. Haxe is a game development
language that targets many platforms, including JavaScript. JSIL compiles .NET programs into JavaScript. Mandreel
makes it easy to port C, C++, and Objective C games to a variety of platforms, including Windows Phone and JavaScript.
More recently, an open source C++-to-JavaScript compiler called Emscripten has gained prominence and
momentum. In the past, I've argued passionately that compiling C++ to JavaScript was a bad idea and that defining
a portable bytecode was a better direction for the Web. However, the future is created by the people who invent it.
Alon Zakai, with a vision in his head and persistence in his actions, created Emscripten as an open source project.
Eventually Mozilla hired him and gave him funding to continue full-time development on Emscripten. Emscripten
has since been proven viable and even Epic's Unreal Engine 3 has been ported to HTML5 with it. While I would have
loved to have seen Google's Native Client technology gain adoption, I now believe that compiling C++ to JavaScript
has strong survival genes: Emscripten-generated code runs on all recent browsers, including Internet Explorer 10,
and Native Client is a far more complicated piece of technology.
In this chapter, I will describe how Emscripten works, why it's fast, what's possible, and then I will demonstrate
what it's like to port an existing C++ game to the browser. Being new, Emscripten is rough around the edges, but I will
cover the common problems you may run into and how to address them.
What is Emscripten?
Emscripten relies heavily on LLVM, a set of open source compiler tools. The LLVM project provides both Clang,
a compiler from C++ to platform-independent LLVM instructions (known as LLVM IR), and a set of platform-
independent optimization passes and tools. The LLVM project is hosted at
http://llvm.org/
. With the help of
