An interactive particle system, where particles flow around according to some physics-inspired laws and interact with mouse/touch movements in real-time. The goal here is not to simulate anything out of reality, but rather something that is satisfying to play around with. A bit of digital art.
This demo shows how simple general computation can be performed in WebGL alongside rendering, despite the lack of actual compute shaders in WebGL. Here, the positions and velocities of the particles are being computed on the GPU for every frame, allowing a very large number of particles to be simulated in real-time.
To interact with the demo, move the cursor or drag a finger around at different speeds. The simulation and visuals can be customized in the settings above. You can test the performance of the system by changing the particle count, but please beware that the highest counts may crash the browser on weaker devices.
When trying higher particle counts, it is recommended to use a single-pixel particle size, fullscreen mode and a lower the particle opacity for better visuals.
For more information about the underlying math and pipeline, see the dev blog entry about this demo.