When I Used AI to Write an HTML Game but Was Forced to Learn WebGPU Compute Shaders

Here’s the thing.

Last week I wanted to build a simple particle firework effect – the kind where you click the screen and hundreds of colorful particles explode, fall, and fade away. I’d written something similar with Canvas 2D before, so I knew the drill. But this time I decided to be lazy: I dumped the requirements into Claude and asked it to generate a complete HTML file on the spot.

The AI gave me working code in maybe fifteen seconds. Clean, well‑commented, even with gradient‑colored particles. I opened it in the browser, clicked a couple of times – 200 particles, smooth as butter. Then I bumped the count to 2,000 – the frame rate tanked to ~35 fps. At 5,000 particles, it became a slideshow at 12 fps.

That’s when it hit me: AI can write code that runs, but it won’t help you when it runs like crap.

So I went down a frustrating but incredibly rewarding debugging rabbit hole. And the thing that finally saved me wasn’t a smarter AI – it was WebGPU’s compute shaders.