🦠 Slime Sim WebGPU

I made this slime mold simulation to learn more about WebGPU and compute shaders. It's essentially a recreation of Sebastian Lague's coding adventure (albiet with fewer features).

Here's a 45-second demo on Twitter, Threads, and r/GraphicsProgramming. You can also try the playable demo on my website (linked in the about section of this repo). Just know that WebGPU doesn't work on all devices so you might get an error screen.

If you prefer a more in-depth video, you can checkout this 5-minute devlog on YouTube where I showcase an extended demo and answer the following questions:

What is WebGPU?
What are compute shaders?
What is the graphics pipeline for this slime simulation?
What happens in each shader pass?

Setup Guide

# Setup Guide (for everyone).
git clone https://github.com/SuboptimalEng/slime-sim-webgpu.git
cd slime-sim-webgpu
npm install
npm run dev

# How to Deploy to GitHub Pages (mainly for me).
# First, go to main.tsx file and enable StrictMode.
npm run build
npm run deploy
# Disable StrictMode before running locally and pushing to GitHub.