Native Code vs. Browser (a test)

I was really happy to see this test (from themaninblue) comparing Canvas, HTML, SVG, and Flash. It says that Flash is a little bit faster at drawing a particle system, not that much.

I ran his tests for my desktop PC, using the "1000 particle" mode:
And in the land of the blind, the one-eyed man is king...

So just for kicks, I coded up a native windows particle system just to compare. (It's quite safe to try, if you have Windows.)

My code runs about 350FPS on the same test

I know that's sort of silly, but it also looked bad if I used more than 1000 particles at a time. So my simple code is 12x faster than the fastest Canvas browser, and 8x faster than Flash. I suspect some of this is the Javascript time, and some is drawing.

This is not a GPU-based app. It doesn't even use DirectDraw. It doesn't use SIMD. It's just a 32-bit bitmap that I draw stuff to, in a loop.

So it seems like there's a bit of room to make browsers faster without requiring a GPU. Or maybe there are better opportunities to do vector operations in browsers and make Javascript use less time.

But overall, I don't know why we're not paying attention to pixel-bound inner loops in the browsers, like people have for years in native code. There's apparently a lot of room for improvement.

9 comments:

  1. Anonymous9:37 AM

    Have you tried testing HTML5 on Safari? Or seen the demos on apple's site. They seemed awful Safari-specific but they were rock solid (easily 60fps) on my piddly 13" macbook pro. Very iPad-like. Chrome in comparison was chugging.

    ReplyDelete
  2. Anonymous10:34 AM

    More for an apples-to-apples comparison, you might wish to try porting your C++ code to http://code.google.com/p/nativeclient/. I'm also interested in what the WebGL performance would be running in hardware with the animations handled by shaders.

    ReplyDelete
  3. @steve - Safari is not faster, at least for these tests. Not sure why.

    @gavin - Also apparently Chrome now has an "enable hardware compositor" flag....should try that one too. For the physics portion, I tweaked his javascript for awhile and got a 10% speed increase (not much). But probably removing some of the object stuff and just doing tight for loops might give v8 another leg up.

    ReplyDelete
  4. The reason Chrome is slow on the IE9 bitmap tests is due to its high-quality resampling...they have put in a patch to allow animated bitmaps to draw with bilinear: https://bugs.webkit.org/attachment.cgi?id=57332&action=edit

    I wonder how fast their software bilinear is :)

    However, regarding the original post, the particle test is just vectors, so it shouldn't matter so much.

    ReplyDelete
  5. sort of blends rendering and "business logic" though, no? wouldn't it be interesting to connect v8 or tamarin to you compositor? (but yeah, I agree :))

    ReplyDelete
  6. @sree - definitely, and Chrome's profiler says more than half the time is javascript, so it could be very v8 dependent. I wonder how well that profile reflects reality. :)

    ReplyDelete
  7. Anonymous8:49 AM

    Dear Michael

    I downloaded and ran your desktop version of the particle simulation, and it does indeed give a very high frame rate.

    What language did you use to make the exe? Would you mind sharing the source code?

    Kind regards

    Matt

    ReplyDelete
  8. Anonymous12:26 PM

    Hi Michael

    I took the plunge and downloaded your dekstop particle app - amazing how much faster it runs than anything browser based.

    I am a science teacher and love coding simple flash and/or javascript animations.

    May I ask what language your desktop animation is coded in? And would you be willing to share it? I always think a particle animation is a great way to try and learn a new language. Perhaps I have never learnt any languages outside of the browser.

    Kind regards

    Matt

    ruby_murray1@hotmail.com

    ReplyDelete
  9. Hi Gabber - the code is my own framework, used in a bunch of large applications, so it's not publicly available.

    However, you may be able to adapt blttest (http://stereopsis.com/blttest/) to do something similar.

    ReplyDelete