Firefox 22 is now released, and I am very excited!  One of its key features is a new set of optimizations for asm.js, a highly optimizable subset of JavaScript.  asm.js was developed by Mozilla while working jointly with game industry leaders to find a path to port high performance C++ games to the Web.  That, however, is only the start of what it can do.

There are two main use cases that asm.js addresses.

The first is bringing full native applications to the Web.  Using a tool called Emscripten, C++ code can be cross-compiled to JavaScript, specifically the asm.js subset.  It integrates well with existing tool chains, as we have demonstrated by porting Unreal Engine 3 to the web in 4 days.  That’s an incredible achievement considering we ported over a million lines of code.  This accomplishment provides a smooth path towards publishing existing applications on the Web, or for treating the Web as a platform alongside traditional desktop and console targets.

Another route is using asm.js and Emscripten to port libraries that require significant computing power.  HTML5 game developers sometimes find it hard to achieve an acceptable user experience should they seek to include performance intensive elements such as physics or pathfinding in their game.  This often leads to developers needing to optimize every bit of their game just to get something workable.  asm.js makes including these intensive elements more practical.  You can now use an asm.js compiled library, such as Bullet or Box2d for physics, to supercharge the 5%-10% of the code that does most of the work and write the rest by hand using traditional JavaScript.  This approach gives you the speed of near-native execution where you need it and the ease and flexibility of modern JavaScript everywhere else.  Emscripten provides the needed capabilities for creating coder friendly interfaces for asm.js libraries to make them easy to interact with.

Screen-Shot-2013-06-25-at-2.11.19-AM

asm.js is not limited to games.  The performance it can bring to web applications opens up many interesting possibilities for speeding up existing web tasks, or bringing new experiences to the Web.  Efforts to port video decoders and photo processing tools using asm.js are also seeing performance increases from taking advantage of existing C++ code without plugins or browser-specific technology.

There have been several attempts to provide a solution for C++ developers wishing to target the Web.  We believe asm.js is the best solution, and here are a few of our reasons why:

1.  It’s just JavaScript.

asm.js is compatible with existing browsers.  Emscripten cross-compiled code requires Typed Arrays, a feature that is well-supported by modern browsers today, including Internet Explorer. There is no need to wait years for the technology to spread, or take the risk that it never will.  Furthermore, asm.js is a formalization of a pattern of JavaScript that web browsers have already been optimizing for, namely compiled C/C++ as generated by Emscripten and Mandreel, and a sample of that type of code appears in a popular benchmark, Google Octane.

2. It’s fast.

Thanks to all of the work browsers have already done to optimize JavaScript in general and compiled C++ in particular (in part due to such code appearing in Octane), it is very easy for browser vendors to optimize for it and unlock its full potential — it took a single Mozilla developer about 3 months to implement OdinMonkey, our asm.js optimization module for Firefox.  Google developers also quickly achieved large speedups on asm.js, as reported in their IO keynote. In just a short time it is possible to get to about half the native speed of C++.  That’s faster than Java, in the case of Box2D.  That is just the first draft – we expect to get much closer to native performance with additional development on the browser side.

3. It dramatically reduces the cost of supporting the Web.

For developers already working with C++, Emscripten makes the Web just another port target.  Once it’s integrated into your tool chain, the web version can be recompiled alongside your other platforms whenever any updates are needed.  We have ported full properties in very short time periods.

4. It reduces or eliminates the need for plugins.

Companies that turn to plugins to enable their games or applications often see a significant friction in user adoption due to security warnings.  asm.js provides an alternative path that eliminates the security messaging issue while still providing much of the performance, all within a safe execution environment.

5. It enables reuse of existing C++ libraries.

There is a wealth of open source C++ libraries out there waiting to come over to the Web.  This is a vast amount of coding effort whose value has now been unlocked for web developers.

asm.js is still a new technology, and we have plenty of work to do to provide its full potential to the developer community.  Mozilla is grateful to Epic and other game industry leaders that have already started to work on products using asm.js.  These early examples are helping to prove the value, shape the technology, and encourage other browsers to priorities optimizations for it.  The best way to help support the development of asm.js is to start using it and let us know what you think by adding comments to this post.  If you are a game developer or have a performance intensive application and choose to port it over, share your work with the world and let us know about it!

For an in-depth look into what asm.js is and isn’t, have a look at this post by Alon Zakai. Well worth the read!

8 Responses to “asm.js: it’s really fast, backwards compatible, and now in the release version of Firefox.”

  1. Firefox Delivers 3D Gaming, Video Calls and File Sharing to the Web | The Mozilla Blog Says:

    [...] described a supercharged subset of JavaScript (asm.js) that enables developers to create high-intensity applications, like 3D games and photo processing, [...]

  2. Firefox מביא לרשת יכולות משחק בתלת ממד, שיחות וידאו ושיתוף קבצים « חדשות מוזילה Says:

    [...] הרכיבו רכיב משנה ל־Javascript בשם asm.js המאפשר למפתחים ליצור יישומים עתירי עצמה, כגון משחקי [...]

  3. Firefox 22 - kandrei.ro Says:

    [...] imbunatatit pentru asm.js (subset pentru JavaScript care permite construirea de aplicatii web cu grafica 3D intensiva) [...]

  4. Caspy7 Says:

    I couldn’t help but wonder if it might be helpful to create an asm.js evangelism site that has code examples and demos? And also a repository of OSS compiled C++ libraries/software. This might help give an understanding of capabilities and foster adoption.

    My other question, and I don’t know if you’ll know the answer, would it be possible to include WebGL in Emscripten? I know that some webapps have used WebGL for processing-intensive things like photo processing and video decoding. I’m just wondering if it would be possible for Emscripten to pick up on the type of math/code that could benefit from WebGL and compile to it? (Or are these types of decisions simply to high-level for a compiler to judge?)

  5. Firefox 22 Adds Web Video Calls, 3D Gaming, File-Sharing | Best Seedbox Says:

    [...] 3D gaming a supercharged subset of JavaScript (asm.js) is what enables developers to create high-intensity applications directly on the [...]

  6. mbest Says:

    There is in fact such a site that has much of what you are looking for on the Emscripten GitHub repo. Here is the link: https://github.com/kripken/emscripten/wiki. In addition, we are starting to ramp up efforts to provide more information via the new game section on MDN: https://developer.mozilla.org/en-US/docs/Games but this is still early.

    Assuming you want to use it for graphics processing, currently Emscripten will convert OpenGL calls into WebGL. WebGL is essentially a layer on top of OpenGL ES 2.0, so coding for that should convert nicely and achieve the best results.

  7. mbest Says:

    Your last question about having asm.js taking advantage of the GPU for processing reminded me of something else that you maybe interested in. There is a project trying to address bringing more power to the web through parallel processing called RiverTrail: https://github.com/RiverTrail/RiverTrail/wiki. This is not specific to Emscripten nor are their short term plans to take advantage of it but it is note worthy.

  8. niutech Says:

    You can view and complete the list of projects using asm.js here: https://github.com/dherman/asm.js/wiki/Projects-using-asm.js

Leave a Reply