PLAY!

Fluid Simulation

A fluid simulation running in the browser using WebGL and Rust. This project was a learning experience in how to use Rust to write WebAssembly and interact with the WebGL API. Also a lot about GitHub Actions and GitHub Pages was learnt.

Note

A simulation quality of "Ultra+" or "Ultra" may significantly slow down mobile devices due to the simulation running at, or nearly at, native resolution. Use these settings with caution.

Dev

1. Make sure to install the required tools:
   • The Rust toolchain
   • wasm-pack
   • python
   • Node.js
2. Clone this git repository.

   git clone https://github.com/wilzet/fluid-simulation

3. Run the following commands to start a dev server for the project:

   python src/glsl-to-rust-stringify.py   # Generate the `shaders.rs` file
   wasm-pack build                        # Build the fluid simulation package
   npm install                            # Install required npm packages
   npm run dev                            # Start a dev server on localhost:8080
   
   # npm run build   # Make a production build of the project in the /public directory

Resources

• NVIDIA GPU GEMS: Chapter 38. Fast Fluid Dynamics Simulation on the GPU
• WebGL-Fluid-Simulation - PavelDoGreat
• But How DO Fluid Simulations Work? - Gonkee [VIDEO]