• Advertisement
Sign in to follow this  

[web] Verlet Water in HTML5

This topic is 2407 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

[media]http://www.youtube.com/watch?v=Vr56GCwBnRg[/media]
[font="arial, sans-serif"][size="2"] [/size][/font]
[font="arial, sans-serif"][size="2"] [/size][/font]
[font="arial, sans-serif"][size="2"][size="2"]Live HTML demo: [url="http://silly.isgreat.org/molecules/molecules.html"]http://silly.isgreat.../molecules.html[/url][/size][/size][/font]


Wanted to experiment a little bit with high-performance HTML.
Made a little water simulation which I thought of turning into a game.
In the end I couldn't get enough particles to run in real-time, so I will probably write my game in Java/C

On the upside I did manage to write a nice and simple javascript AABB tree implementation which I posted on source-forge.: [font="arial, sans-serif"][size="2"][url="https://sourceforge.net/projects/javascripaabbtr/"]https://sourceforge....avascripaabbtr/[/url][/size][/font]
[font="arial, sans-serif"] [/font]

Share this post


Link to post
Share on other sites
Advertisement
You might have better performance if you used [url="https://developer.mozilla.org/en/DOM/window.mozRequestAnimationFrame"]requestAnimationFrame[/url].

Also, you might want to look into using an canvas animation library. They are usually much more optimized than what is normally hand-written (not saying your code is bad), and they provide a lot of objects that will allow you to do the same thing in less time, and usually more efficiently.

Only libraries I know off the top of my head are [url="http://processingjs.org/"]Processing.js[/url] and [url="https://github.com/mrdoob/three.js/"]Three.js[/url], though I'm sure a great many more exist.

Share this post


Link to post
Share on other sites
[quote name='TheLifelessOne' timestamp='1308262992' post='4824264']
You might have better performance if you used [url="https://developer.mozilla.org/en/DOM/window.mozRequestAnimationFrame"]requestAnimationFrame[/url].

Also, you might want to look into using an canvas animation library. They are usually much more optimized than what is normally hand-written (not saying your code is bad), and they provide a lot of objects that will allow you to do the same thing in less time, and usually more efficiently.

Only libraries I know off the top of my head are [url="http://processingjs.org/"]Processing.js[/url] and [url="https://github.com/mrdoob/three.js/"]Three.js[/url], though I'm sure a great many more exist.
[/quote]

Thanks for the link [img]http://public.gamedev.net/public/style_emoticons/default/smile.gif[/img]. Actually I profiled most of my execution time to be collision detection between the particles. So I never tried to optimize the graphics code. This link might be useful for another project I am working on, though .

Share this post


Link to post
Share on other sites
Sign in to follow this  

  • Advertisement