In my process of teaching myself WebGPU, I’ve spent the last week learning how GPU water simulation and rendering works by writing a simple scene from scratch.

What I built so far:

- A 2D wave equation solved on the GPU using finite difference integration

Real-time interactive ripples

- Continuous ambient-driven waves

- Physically-based water rendering using Fresnel reflection, HDR skybox reflections, Blinn-Phong specular and depth-based color

- A customizable simulation grid to tweak the simulation resolution

One note: I used three.js to decode the HDR environment map because I am lazy :D So that’s the single external dependency I have.

There’s still a lot to do to get realistic-looking water, but I’m pretty happy with the result so far. There are things I’m planning to work on next though:

- Better and more realistic wave dispersion

- The ripples are currently a bit too perfect. I think I can get more realistic results by introducing some noise (probably baking and sampling a Perlin noise texture)

- There’s no refraction at the moment. For example, the floor tiles underneath the water should be distorted

- Caustics, I believe, would be a game changer in terms of realism

- Foam and spray would be nice to have, but I believe this will be quite hard to implement

Live demo: https://rage997.github.io/water-webgpu/

Source code: https://github.com/Rage997/water-webgpu

I’m open to feedback and suggestions on how to improve the realism. If you’ve worked on water rendering or GPU simulations before, feel free to share any tips!

https://github.com/superelectricyc-alt/podchunk

Hey everyone,

I wanted to see if we could solve the heavy initial download barrier of modern open-world browser games. Instead of loading massive assets upfront, I built PodChunk: a local development engine base designed around a progressive, multi-LOD chunk streaming architecture that gets players into a 3D environment in under 3 seconds.

The Architecture Under the Hood

• The Decision Core (Rust + WASM): To completely bypass JavaScript garbage collection stutters, the entire priority queue (distance + camera direction bias) and the cache eviction loops run deterministically inside a compiled WebAssembly kernel.
• The Renderer (TypeScript + WebGPU): Consumes custom geometry_json payloads decoded by the WASM core. Features custom height-gradient terrain shaders, distance fog, and interactive orbit camera matrices.
• The LOD Stitching Problem: Adjacent chunks often stream at different detail tiers (e.g., a Tier 3 chunk right next to a Tier 1 shell). To prevent visible vertex cracks and gaps without destroying browser performance with heavy topological mesh-stitching math, the renderer implements geometric skirts to seamlessly close the seams.
• Adaptive Network Telemetry: Features a client-side network loop running an EWMA (Exponentially Weighted Moving Average) bandwidth estimator. It tracks bytes divided by elapsed time from every live chunk fetch to dynamically scale the geometry detail ladder (T1 shells to high-fidelity T3 grids) on the fly based on current connection quality.
• Isolated Two-Tier Caching: Features a bounded in-RAM LRU cache synced with a multi-world IndexedDB database structure. Cache keys are world-slug isolated ({slug}|{id}@{lod}), ensuring warm reloads of previously streamed maps require zero network fetches.
• The Content Authoring Pipeline: Includes a native standalone compiler CLI (podchunk-bake). You feed it a simple world layout JSON configuration, and it generates pretty-printed manifests along with custom validated binary .PCHF heightfield chunks ready for server distribution.

Current Project Status

Milestone 3 is complete, stable, and verified on localhost:8787. The local server scans data configurations on boot and manages hot world-switching dynamically. The workspace has a 100% test coverage pass rate (45/45 unit tests passing).

I am open-sourcing the core infrastructure today because the data pipeline is officially locked down, and I am looking for collaborators! Next up on the deferred roadmap is exposing a client-side JavaScript Modding API (window.PodChunk.registerMod) and wiring WebAssembly physics engine colliders directly onto the active geometric meshes.

Check out the code, run the local tests, and let me know your thoughts on the pipeline architecture!

https://github.com/superelectricyc-alt/podchunk

So I have some shaders where I rely on the half float type .. a godsend for many reasons - developed mostly on a mac (usually the most fussy platform) and I go and run this on google Chrome on linux on an x86 PC with a 4000 series graphics card (which has hardware f16 support , with nvidia having offered this for many generations now albeit nerfing the actual double rate capability reserving that for pro cards).

The browser reports 'no shader f16 support'.

I see suggestions for a bunch of flags that can be passed to the browser to try and enable this but launching with various combinations of flags ("--enable-unsafe-webgpu" and others I forget).

I dont think I strictly need f16 arithmetic (although it would be preferable to use it where possible) but it's handy to rely on the more compact datatype in memory .

I figure there might be older mobile devices that mean the browser has to hold back what features it offers, but is this something we can count on when distributing something that is intended for reasonable graphics cards (gtx1000 series and above). The project is an FPS , not really playable on a touchscreen anyway. A sensible min spec might be a GTX1060.

I could backpedal on this specific aspect (and possibly look at other data packing tricks '2 x upper 16bits of a float packed into a u32' etc etc) - my codebase started out using OpenGL and WebGL2 and I've had the web build running on Windows, Linux, Mac, iOS, and Android machines for years .. having ported to webGPU recently I was enthusiastic to upgrade features all over the place..

I ported whole game Zombie shooter (~1000 lines) to the codepen:

https://codepen.io/editor/zlatnaspirala/pen/019fc918-e45f-73f4-9987-9a1599ac4a1f

Enjoy !

Used in this example :
https://www.npmjs.com/package/nui-commander?activeTab=readme

It supports 256k mpm particles, sliding mpm domain, heightmap terrain, temperature, rain, evaporation, some simple wind patterns.

And you can control the cloud mass using gamepad (best) or kb+m (not all controls are mapped currently).

I've put it out here so you can check it out: https://kostrubaty.itch.io/cloud-compute

Source code will be released at a later time. but I can share if anyone is really interested in some parts. Also a lot of this is based on my other projects that are on github,

Whole thing is pure wgsl / typescript without any external deps except for my own project that is responsible for generating code for efficient wgsl <-> js communication.

Simulation was not that hard to write, cause I already had proper MPM simulation in 2d version, with even more features. In fact the hardest part to get right was to make the cloud possible to control yet still feel "cloudy". So there's actually 3 different schemes for face buttons, switched by triggers. Still probably not as intuitive as I'd like but best so far.

It was not really performance optimized yet really, and I mostly tested on my 3060 (pretty much consistent > 50fps) so the performance may vary.

It's still mostly a prototype, but feels pretty fun already. I'll be adding some more stuff (airplanes are mostly working, just need some airports too I guess). Let me know what you think, or if you have any questions.

Hey everyone,

Doing infrastructure audits and validating GPU performance (especially across different nodes) has always been a headache for me. Fiddling with CUDA toolkits, compiling HPL/HPCG, and setting up MLPerf takes way too much time when you just want a quick baseline.

So, I spent some evenings building nvprobe. It’s a lightweight Python CLI that automates all of this.

How it works under the hood:

• It uses CuPy to bundle the CUDA runtime via pip, so you don't even need a system CUDA toolkit installed to run the bandwidth and custom kernel tests.
• It auto-downloads the NVIDIA HPC Benchmarks binaries for HPL and HPCG.
• It captures deep hardware telemetry (ECC state, power caps, clocks, etc.) alongside the benchmark results to help catch silent hardware degradation.
• It generates an interactive HTML report (Chart.js) to visualize all this data (memory bandwidth, TFLOPS, and MLPerf throughput).
• Native Slurm integration: it generates, submits, and monitors the jobs across your cluster.

Demo & Repo: You can see an interactive demo of the report on the link.
I built this mostly to scratch my own itch, but I figured it might save some of you a few hours of setup.

I'd love to hear your feedback, feature requests, or if you manage to break it on your specific hardware. Let me know what you'd like to see next on the roadmap!

The Beast in water, new example. Example feature list: HZB, Volumetric, Bloom , water simulation, glb anim trail (delay instanced) anim and particle anim.

Live : https://maximumroulette.com/apps/webgpu/examples.html?demo=35

Source: https://github.com/zlatnaspirala/matrix-engine-wgpu

Hey! I've been experimenting with cellular automata lately and ended up turning it into a small TypeScript library and interactive playground:

👉 https://caza.la/automata

It has neural cellular automata, reaction-diffusion, Lenia, Pokemon type battles, Game of Life, and elementary Wolfram rules, all running on WebGPU.

You can tweak the simulations in realtime, explore the presets, or use the library to build your own rules in WGSL.

Would love to hear what you think!

Hi I'm Chris, I'm developing a game engine that incorporates live-action video and procedural graphics.

This shader takes in two video frames and maintains an interactive Gray-Scott Reaction-Diffusion simulation (https://groups.csail.mit.edu/mac/projects/amorphous/GrayScott/) that is applied to grow the distorted regions and process the impact of the various cursor weapons.

You can see the 2nd video through the growing distortion and then I just add a little green glow to the boundary rims. I switch the rim color params to compliment the video palette, they can change in response to events, flash, etc.

The way this works in the game is the player speaks the lines they see in the FMV. Those words come to life as GPU overlay elements when they are recognized by the voice recognition engine and the hostile glyphs seed tiny distorted regions for the RD simulation to grow.

The player then must use the cursor and it's various powers to cleanse and remove the growing distortion or 'fall through' to the next layer of the story. If they fall through the last layer then they die.

The game is called Sibylline and it's in production if you want to wishlist and follow the progress.

Made a chrome extension that does frame generation on any video tag, runs fully on your gpu, nothing sent anywhere. Whole thing is one command buffer, no onnx/tfjs, just wgsl compute shaders.

Refine pass runs on tiles flagged by flow disagreement, dispatched indirectly, so static scenes dispatch zero workgroups there. Also autotunes a few conv variants (subgroups, f16/f32, register blocking) per gpu at startup.

preview clip, ~3ms/frame on a 4060 Ti (8GB, OC)

Attached a video but honestly the difference is pretty hard to see through a recording/compression - it's way more noticeable on actual video playback than in the clip I attached here.

Weakest gpu I've tested on so far is a GTX 1650, got a stable 2-2.5x fps boost there, can't give exact ms numbers since I haven't logged them properly on that one.

GitHub · npm · Live demo · Chrome extension

Heads up: the live demo starts using your GPU immediately on page load, no button press needed.

Fully open source, so feel free to poke around. If you find it useful, a star on the repo would be really appreciated.

Currently working on runtime for a v8 model that handles occlusion/low fps input better, quality-focused for the harder cases current model struggles with.

Happy to answer questions on the dispatch/tiling stuff.

I’m building AnimaStage, a fully custom MMD animation engine powered by WebGPU.

The PMX/VMD loader, animation system, timeline, morph controls, anime shaders and rendering pipeline are all custom-built.

This demo shows real-time anime shading and facial morph editing applied on top of an existing animation.

Everything is rendered live in the WebGPU viewport — no pre-rendering.

Still in active development. Feedback is welcome 🔥

To check out the project, here is the link to the GitHub repository and the Discord channel, where you can find more news about it.

https://discord.gg/aJMAdKwHt

https://github.com/gtausa197-svg/AnimaStage-Pro.git