Black hole and lasers (first attempt at Processing.js)

Share your Work

afreise

Black hole and lasers (first attempt at Processing.js)

in Share your Work • 3 years ago

As my first try to use Processing.js I have made an interactive and animated webpage banner. I might use it for the webpage of a science exhibtion later this year:

http://www.gwoptics.org/processing/blackhole/

It runs slower than I had hoped. In fact only Safari seems to be able to run this at sufficient speed, Chrome does an OK job and it stutters along in Firefox (I have not tried Opera and it switches to a static image for IE). But overall I am very excited about Processing,js!

Andreas

Replies(3)

Jack Kern

Re: Black hole and lasers (first attempt at Processing.js)

3 years ago

Nice job!

I'm browsing on a relatively old machine but I get maybe 5 fps or so in chrome. I imagine it's mostly the pixel-based manipulation of the black hole borders that is the heavy hitter... have you tried removing that portion and comparing the speed?

I recently put up a processing.js banner on my site as well.

Jack

http://www.jackkern.com
http://www.twitter.com/ElectricJack

afreise

Re: Black hole and lasers (first attempt at Processing.js)

3 years ago

Chrome definately speeds up without the for loop doing the pixel operations. Firefox seems generally slow though.

Ha, I did not see your processing banner before as I am browsing with Javascript off by default. Went back to have a look now. That's much better because the differences in speed don't change the effect very much! It seems to use a lot of CPU power though. Maybe you should stop the draw loop whenever all the boxes become still?

Andreas

Jack Kern

Re: Black hole and lasers (first attempt at Processing.js)

3 years ago

Yeah I've definitely noticed that problem and need to fix it. That's a great idea too - sortof like how physics simulations put things "to sleep" so they don't update until another collision occurs.

http://www.jackkern.com
http://www.twitter.com/ElectricJack