Comments on: HTML5 Canvas 3D particles

By: The useful resources for HTML5 canvas « Newsicare

The useful resources for HTML5 canvas « Newsicare — Tue, 06 Jul 2010 04:19:47 +0000

[...] Sebleedelisle has an amazing 3D demo called [...]

By: Jack Ackins

Jack Ackins — Sat, 19 Jun 2010 10:43:56 +0000

I worked with chipmonk physics engine before and this looks pretty similar.

By: Eric McWeeney

Eric McWeeney — Wed, 24 Mar 2010 01:32:01 +0000

Is it possible to run the particles and instead of click and rotate, that it rotates as the mouse moves while it runs? I know thats crazy, but based upon that, you could really have the beginning of a great 3d interface for a website if the objects were clickable. I found this really cool site with some different experiments. Some of them are similar. This one is cool…
http://www.dhteumeuleu.com/wanna-tell-her/

Thanks for the great work. Keep it up!

-Eric

By: Seb Lee-Delisle

Seb Lee-Delisle — Tue, 23 Mar 2010 02:42:26 +0000

Hi Daniel, do you know how to get it to work in IE9? The “not supported” message is just enclosed with the canvas tags, there’s no more clever browser detection than that.

By: daniel

daniel — Mon, 22 Mar 2010 18:47:45 +0000

I want to try it in IE9 preview…but I just get the not supported in IE message. any chance you can change that for the IE9 preview?

By: Labor für Neue Medien und digitales Entertainment | UFA Lab

Labor für Neue Medien und digitales Entertainment | UFA Lab — Thu, 18 Mar 2010 18:05:27 +0000

[...] interaktives Partikelsystem von sebleedelisle findet ihr [...]

By: Daniel

Daniel — Sun, 14 Mar 2010 17:42:17 +0000

For the records: I think I was wrong with putImageData being always faster than drawImage, seems to depend on the image dimensions. Last time I did tests with small images and putImageData won. When comparing with larger images though drawImage is clearly faster.

Cheers, D

By: Seb Lee-Delisle

Seb Lee-Delisle — Sun, 14 Mar 2010 16:06:28 +0000

Really interesting, thanks Joshua. And yes I should just re-state that the Flash version is doing considerably more work, I was thinking that perhaps I should make an identical Flash version but on reflection, I’m not sure these comparisons are very relevant.

Flash does indeed use multi-core for rendering. It splits up the screen into horizontal strips, one for each core.

By: Joshua Koo

Joshua Koo — Sun, 14 Mar 2010 15:02:26 +0000

Hi Seb,

I like the cool stuff you do Here are some observations running from my machine, a quad core Q8400 2.6GHz running Windows 7.

Canvas Version
Chrome 4 – ~17% CPU
Firefox 3.5.8 ~ 7% CPU
Opera 10.50 – ~3% CPU
All use roughly 40MB of memory

Flash version runs on all at about 40% CPU and 60MB memory with the exception of chrome which uses about 160Mb ram.

As you have mentioned, it may not be a fair comparison in terms different implementations (maybe one could try gradient fills in canvas), in addition different browsers and platform may yield different performances.
However, the performance with 3% CPU on opera was impressive.

I also noticed Flash seems to be using multiple cores to render while browsers like Firefox and Opera seems to run single threaded. Its interesting to note that the new Firefox 3.6 ships with worker threading support, and browsers supporting direct hardware acceleration in the near future gives some hope for the future of canvas.

Cheers,
Joshua

By: Seb Lee-Delisle

Seb Lee-Delisle — Fri, 12 Mar 2010 20:09:46 +0000

I am yet to be convinced that the blitting technique is faster than lots of cacheAsBitmap display objects (or even Bitmaps) on stage. Of course the display objects mustn’t scale animate or rotate, but you could create your own manual conversion of movieclip frames to bitmaps. Sigh. I guess more benchmarks are in order (yawn)