The last 5 years or so have provided a tremendous amount of hype about the capabilities of JavaScript. I think it really kicked off when Google announced their Chrome web browser in September, 2008 along with its V8 JS engine. This seemed to spark an arms race in JS engine performance along with much hyperbole that eventually all software could, would, and/or should be written in straight JavaScript for maximum portability and future-proofing, perhaps aided by Emscripten, a tool which magically transforms C and C++ code into JS. The latest round of rhetoric comes courtesy of something called asm.js which purports to narrow the gap between JS and native code performance.
I haven’t been a believer, to express it charitably. But I wanted to be certain, so I set out to devise my own experiment to test modern JS performance.
Up Front Summary
I was extremely surprised that my experiment demonstrated JS performance FAR beyond my expectations. There might be something to these claims of magnficent JS speed in numerical applications. Basically, here were my thoughts during the process:
- There’s no way that JavaScript can come anywhere close to C performance for a numerically intensive operation; a simple experiment should demonstrate this.
- Here’s a straightforward C program to perform a simple yet numerically intensive operation.
- Let’s compile the C program on gcc and get some baseline performance numbers.
- Let’s use Emscripten to convert the C program to JavaScript and run it under Chrome.
- Ha! Pitiful JS performance, just as I expected!
- Try the same program under Firefox, since Firefox is supposed to have some crazy optimization for asm.js code, allegedly emitted by Emscripten.
- LOL! Firefox performs even worse than Chrome!
- Wait a minute… the Emscripten documentation mentioned using optimization levels for generating higher performance JS, so try ‘-O1’.
- Umm… wow: Chrome’s performance increased dramatically! What about Firefox? Not only is Firefox faster than Chrome, it’s faster than the gcc-generated code!
- As my faith in C is suddenly shaken to its core, I remembered to compile the gcc version with an explicit optimization level. The native C version pulled ahead of Firefox again, but the Firefox code is still close.
- Aha! This is just desktop– but what about mobile? One of the leading arguments for converting everything to pure JavaScript is that such programs will magically run perfectly in mobile browsers. So I wager that this is where the experiment will fall over.
- I proceed to try the same converted program on a variety of mobile platforms.
- The mobile platforms perform rather admirably as well.
- I am surprised.
The Experiment
I wanted to run a simple yet numerically-intensive and relevant benchmark, and something I am familiar with. I settled on JPEG image decoding. Again, I wanted to keep this simple, ideally in a single file because I didn’t know how hard it might be to deal with Emscripten. I found NanoJPEG, which is a straightforward JPEG decoder contained in a single C file.
I altered nanojpeg.c (to a new file called nanojpeg-static.c) such that the main() program would always load a 1920×1080 (a.k.a. 1080p) JPEG file (“bbb-1080p-title.jpg”, the Big Buck Bunny title), rather than requiring a command line argument. Then I used gettimeofday() to profile the core decoding function (njDecode()).
Compiling with gcc and profiling execution:
gcc -Wall nanojpeg-static.c -o nanojpeg-static ./nanojpeg-static
Optimization levels such as -O0, -O3, or -Os can be applied to the compilation command.
For JavaScript conversion, I installed Emscripten and converted using:
/path/to/emscripten/emcc nanojpeg-static.c -o nanojpeg.html \ --preload-file bbb-1080p-title.jpg -s TOTAL_MEMORY=32000000
The ‘–preload-file’ option makes the file available to the program via standard C-style file I/O functions. The ‘-s TOTAL_MEMORY’ was necessary because the default of 16 MB wasn’t enough. Again, the -O optimization levels can be sent in.
For running, the .html file is loaded (via webserver) in a web browser.
Want To Try It Yourself?
I put the files here: http://multimedia.cx/emscripten/. The .c file, the JPEG file, and the Emscripten-converted files using -O0, -O1, -O2, -O3, -Os, and no optimization switch.
Results and Charts
Here is the spreadsheet with the raw results.
I ran this experiment using Ubuntu Linux 12.04 on an Intel Atom N450-based netbook. For this part, I was able to compare the Chrome and Firefox browser results against the C results:
These are the results for a 2nd generation Android Nexus 7 using both Chrome and Firefox:
Here is the result for an iPad 2 running iOS 7 and Safari– there is no Firefox for iOS and while there is a version of Chrome for iOS, it apparently isn’t able to leverage an optimized JS engine. Chrome takes so long to complete this experiment that there’s no reason to muddy the graph with the results:
Interesting that -O1 tends to provide better optimization than levels 2 or 3, and that -Os (optimize for size) seems to be a good all-around choice.
Don’t Get Too Smug
JavaScript can indeed get amazing performance in this day and age. Please be advised, however, that this isn’t the best that a C decoder implementation can possibly do. This version doesn’t leverage any SIMD extensions. According to profiling (using gprof against the C code), sample saturation in color conversion dominates followed by inverse DCT functions, common cases for SIMD ASM or intrinsics. Allegedly, there will be some support for JS SIMD optimizations some day. We’ll see.
Implications For Development
I’m still not especially motivated to try porting the entire Native Client game music player codebase to JavaScript. I’m still wondering about the recommended development flow. How are you supposed to develop for Emscripten and asm.js? From what I can tell, Emscripten is not designed as a simple aide for porting C/C++ code to JS. No, it reduces the code into JS code you can’t possibly maintain. This seems to imply that the C/C++ code needs to be developed and debugged in its entirety and then converted to JS, which seems arduous.
There’s also this: http://clb.demon.fi/html5scummvm/ , a port of ScummVM using Emscripten. Surprisingly, it actually does work pretty decent these days in current browsers.
I think the performance issue with JavaScript has shifted to be in similar places as for Java, .Net etc.:
1) The lack of SIMD which you mentioned. Solvable, worst case in a asm.js style.
2) Garbage collection. From what I read, there is no solution that avoids that either you will take a massive 2x to 3x memory usage penalty or a similarly massive performance penalty due to efficient garbage collection not being possible.
> This seems to imply that the C/C++ code needs to be developed and debugged in its entirety and then converted to JS, which seems arduous.
Well, isn’t that just like when you write C and compile to machine code? The machine code is also unmaintanable. JavaScript (and especially asm.js) is essentially just another assembler language, with the browser being a massively bloated assembler.
The thing that probably truly is lacking though is debug info for emscripten and a debugger that can make use of it.
Thing is, Javascript is actually improving in other ways than simply raw performance. Mozilla has been working on parallelizing code, including easy-to-use SIMD extensions, making it more efficient to transfer data between threads, and speccing out asm.js more completely so it can handle things beyond basic numbers (unicode strings and better memory management, for starters).
Basically this is just a new frontier, another language finally being optimized for performance. The irony is that this is just making it possible to run any language you want on top of a Javascript engine, rather than forcing people to use a replacement language like Dart or demanding that people use or implement an entirely new engine like NaCl.
Frankly, if they can keep expanding it and solve the problem with the size of asm.js “binaries” then I think people will no longer have a reason to hate JS, and it will simply be a transitionary product. That would be an amazing lifecycle for a product reviled by so many as trapping people into one sub-par programming language.
I’d be interested in this new Firefox-javascript-SIMD versus “real” SIMD. Most JPEG reconstruction doesn’t run in C anymore these days… Let alone things like video/audio decoding.
@Metzger:
I don’t have the link handy but, about a year ago, an article popped up on Planet Mozilla showing that the browser’s existing gzip support does a pretty good job of bringing Emscripten’s JS output to size parity with native code.
the ‘everything in javascript’ just reminds me of ‘everything in java’ craze a few years previous to this. likewise ‘everything in ruby on rails’ or whatever the next fad is. ajax web2.0 cgi asp xml xhtml whatever.
disable javascript and java and flash and browse the web at regular speeds again. who needs bitcoin miners in javascript stealing all my precious cpu? :P
Pingback: OpenGL Roundup, April 10, 2014: GDC 2014 Report, libgdx 1.0, Data-Oriented Design and More… | Learn OpenGL ES