
Volumetric Particle Flow - rinesh
http://david.li/flow/
======
bd
There is also a follow-up demo by the same author called Disintegration, with
skinned animated mesh driving particles:

[http://david.li/disintegration/](http://david.li/disintegration/)

------
mhax
Looks reminiscent of a fairlight demo from 2009
[http://www.youtube.com/watch?v=ezltebzdgjI](http://www.youtube.com/watch?v=ezltebzdgjI)

~~~
implr
They did two much more impressive demos[1][2] with this technology, including
drawing complex geometry using only point sprites, on DX9(no compute shaders).
It's remarkable that those five year old demos could easily do flows, shading
and blending on milions of particles in real time, while this JS version
starts dropping frames at 262K.

[1] Agenda Circling Forth
[http://www.youtube.com/watch?v=L5w7Gh7WBjw](http://www.youtube.com/watch?v=L5w7Gh7WBjw)

[2] Ceasefire
[http://www.youtube.com/watch?v=Grqb1aIa_4s](http://www.youtube.com/watch?v=Grqb1aIa_4s)

~~~
pdkl95
As cool as those are, I've always found Numb Res to be the most impressive:

[http://directtovideo.wordpress.com/2011/05/03/numb-
res/](http://directtovideo.wordpress.com/2011/05/03/numb-res/)

(
[http://www.pouet.net/prod.php?which=56900](http://www.pouet.net/prod.php?which=56900)
)

(
[https://www.youtube.com/watch?v=LTOC_ajkRkU](https://www.youtube.com/watch?v=LTOC_ajkRkU)
)

Subtle presentation a great effect, but this bit from the demo's nfo is kind
of insane:

    
    
        3d smoothed particle hydrodynamics with a fully-featured solver,
        supporting surface tension, viscosity and collisions with arbitrary meshes. 
    
        rendering as metaballs converted to triangle meshes with marching cubes. 
    
        simulating around 250,000 - 1 million particles per frame and generating & rendering
        several million vertices per frame during triangulation. 
    
        except we wanted to do it in realtime. on a consumer gpu. on vanilla directx 9.
        no cuda/compute, no geometry shaders. (they'd probably be too slow anyway.)
    
        with everything else youd expect from a modern demo going on around it and on top.
        the best possible lighting, depth of field, post-process antialiasing.
    
        twice. (for stereoscopic 3d.)
        with style.

~~~
gioele
The page also shows that sometimes what you think is hard is easy and what you
overlook is the really difficult bit:

> The problem with SPH in realtime is it’s really really hard. The simple
> explanation of the algorithm is: “take all the particles near my particle
> and perform some force exchange between them”.

At this point I was expecting a long discussion on all the clever tricks they
have found to calculate the force exchange between thousands of particles in a
snap. And instead...

> The force exchange is easy; the “all the particles near my particle” is a
> bitch. On GPU it’s even more of a bitch; and in 3D it becomes an order of
> magnitude more of a bitch.

> [...]

> The problem is simply the neighbourhood search. You end up with a variable
> amount of fast-moving particles affecting each particle, where it’s hard to
> pick an upper bound – so the spatial database is hard to construct. If you
> solve the neighbourhood search, you can solve SPH.

------
vosper
This is really cool. Is there a reason it looks a bit out of focus, even with
millions of particles? Some kind of blurring effect, maybe?

------
jbarrow
Using Safari, which isn't supported, but I wanted to say kudos to the author
for adding a video for unsupported browsers. That was definitely a neat
feature that many WebGL demos overlook!

~~~
bionsuba
Safari is supported, you just have to enable WebGL. I am using it just fine
with Safari 7.

------
matt-attack
How is it that there's (what appears to be) c source code in there:

[https://github.com/dli/flow/blob/master/flow.js](https://github.com/dli/flow/blob/master/flow.js)

~~~
implr
That is GLSL, the language pixel, vertex (and other) shaders are written in.

------
theophrastus
I've no idea what all you folks are using, but in my hands (linux amd64 i5 8Gb
debian/jessie) this is a very impressive website in that it straight-out
crashes firefox/iceweasel (31.1), stymies firefox nightly (35.0a1), and leaves
google-chrome (37.0.2062) declaring that it couldn't be loaded. (just a
theory: i'm running nouveau on my nvidia, as the last blob wouldn't compile)

~~~
ineedtosleep
Surprisingly, Firefox performs better than Chrome for me.

i7, 20GB RAM, Quadro K2000M, Fedora 19, latest stable of both Firefox and
Chrome.

------
blueflow
I have no idea in what is going on or what this is about, but adding the Video
for unsupported browsers is a great idea.

------
te
Really wish there was convention to annotate link titles that immediately bog
the CPU.

~~~
joncalhoun
I made the mistake of hitting the 1m button.. Bad decision.

------
noobermin
I think it's about time I jump on the js bandwagon then.

~~~
orbifold
This has really nothing to do with js. I could mechanically translate the demo
to Haskell or Python and it would perform equally well, as all the heavy
computations are done on the graphics card and those are given in a C like but
implicitely parallel shader language. All this really demonstrates that the
webgl bindings to opengl have minimal overhead. One thing that is impressive,
how you can trivially and more or less declaratively define a user interface
using the browser rendering engine, whereas a similar user interface in a
simple opengl demo would have to be very primitive or use a third party
library. This makes such webgl demos much nicer to interact with compared to a
similar demo written in c, but the actual code is nearly the same, since it is
mainly library calls to opengl.

------
cypher543
Very cool! Smooth as silk at 524K on my GeForce GTX 650 Ti and Chrome 37. 1M
makes it a bit choppy, but still pleasant.

------
thesz
I see only some sphere with a spot. What is going on there?

------
fredsted
Very smooth - running on Safari 7 on an i5 and a 660ti

------
manish_gill
Works, but my MBA 2013 i5 shooted up to 98C. :o

------
sleepychu
Looks like blood in a vein on the default xD

------
physPop
No source code commenting? No problem.

------
spingsprong
It crashes my browser

------
chaitanyav
Awesome demo :-).

------
wormik
great stuff. nice job!

