Javascript Depth of Field Effect


Depth of Field Effect in Pure Javascript



This a nice demo done 100% in Javascript and one of the purpose is to show the speed of Google Chrome Javascript engine.

You can launch the demo directly HERE

The demo runs faster on Google Chrome than on Firefox.

Depth of Field Effect in Pure Javascript

And for IE users (at least on WinXP!) here is the video:



More information Depth of Field @ Chrome Experiments

Related links:

Update

Depth of Field Effect in Pure Javascript
Rendering in Google Chrome

Depth of Field Effect in Pure Javascript
Rendering in Firefox


11 thoughts on “Javascript Depth of Field Effect”

  1. Cyril

    Wait, for me image quality is not the same at all between firefox and Chrome. While firefox display nicely filtered balls, Chrome display them badly interpolated and pixellated, you can’t compare performances in this condition.

  2. JeGX Post Author

    I updated the post with chrome and firefox rendering. It’s hard to see the difference.

  3. Jami

    The smaller the window the faster the demo runs, so obviously the bottleneck is somewhere in the rendering engine; thus I don’t know how this is this supposed to show the speed of Chrome Javascript engine…

  4. FMoreira

    “The smaller the window the faster the demo runs, so obviously the bottleneck is somewhere in the rendering engine”

    It’s a bootleneck but it is a natural one… If the rendering are gets smaller the number of pixels in the screen also get reduced. Less pixels to render to means a jump in performance.

    “thus I don’t know how this is this supposed to show the speed of Chrome Javascript engine…”

    If the same demo, in the same machine, runs faster on Chrome than in Firefox thats because the JavaScript Engine is well designed… I guess…

  5. Jami

    “If the same demo, in the same machine, runs faster on Chrome than in Firefox thats because the JavaScript Engine is well designed… I guess…”

    It might run faster because chromes rendering engine is faster than firefox. The whole script behind the demo doesn’t seem to be complicated enough to tell anything about the speed of the javascript engine. The “Qt Demo Browser” for example has a faster javascript engine than firefox (I have tested this with several good benchmarks) but this demo runs much much slower in Qt Browser than Firefox.

    Some hundred vector operations (even in a script) aren’t such a performance killer like spirit rendering with alpha blending done in software.

  6. rogalik

    The demo on my firefox seem to run only when I move my mouse (that is, ff refreshes the view when my USB mouse is refreshed)

  7. Ayo

    this is silly..hardly works on my firefox. more like a slideshow..and i am running on 2gb memory with intel core duo…am i missing something..? ah yeah..my internet connection…too bad our future apps will rely on the reliability of the internet

  8. Abhishek Dey

    Runs great on Opera and Chrome. Slide show in Firefox 3.5.

    and doesn’t support on IE8!!!

Comments are closed.