为什么asm.js项目在Chrome和FireFox中的运行速度更快？

Question

I have ported a game engine project for my university course from C/C++ to JavaScript using emscripten. The asm.js optimization flag is set and I have been measuring the performance. But what is puzzling is that the performance in Firefox is bad. While the project runs very well in Chrome and Opera. This doesn't make sense to me given that FireFox is the browser utilizing asm.js optimization.

This project is a downhill slalom racing game using SDL and WebGL. Running in Firefox on my laptop the profiler shows that the demo is completely bound by the CPU, the bottleneck appearing around _SDL_LockSurface() and _TTF_RenderText_Solid(). These are used to render the dynamic text among other things.

And yet in Chrome the CPU is idle most of the time on the same system. And performance is similar in Opera. Does this mean the asm.js optimization is not working? Firefox reports the asm.js code has compiled successfully. So why is this optimization backfiring and resulting in execution that is at best half the frame rate? I've tested with FF version 28, also the current nightly build. The demo can be found here, http://www.susurrus.mars-station.com/page7.php?lang=en

Answer 1

I was thinking about this question for a long time and I might have an answer for you. Simply, get rid of canvas.getContext('2d') . I guess asm.js is not your problem at all.

As @BorisZbarsky said, these are graphic calls that has nothing to do with asm.js. You answered that these run without difficulty. I tested it on my own and a lot of things that can follow after getContext as 2D is heavy graphic operation, that you really can't do at realtime fps.

Simple example there: http://jsfiddle.net/windkiller/8r3gP/ It is very simple animation, but it eats 60% of my cpu.