Lil Conway Game of Life Simulator but 3D
Hey guys, I had this idea for an idle game type project and this is my current working prototype using gemini and antigravity.
Tools:
Core Engine: C (compiled to WebAssembly)
Frontend Framework: React + TypeScript + Vite.
3D Rendering: Three.js via react-three/fiber.
Styling: Vanilla CSS
The intention behind vibecoding was to test out web-capabilities for myself even if the produced code isn't the best. Its relatively computation heavy.
I started off planning the general architecture. React could not calculate the required computations, so all the heavy lifting was offloaded to a web assembly engine in c. Then I planned the bridging module to access pointers from js. At this stage, I sent the plan to the agent and had some back and forth till the logic ran correctly.
Then I planned using fiber to map the visuals and then did some more ui tweaking.
Things I noticed:
Maybe its just Gemini but its not great at finding efficient solutions to problems lol. Either that or my planning/querying needs improving.
For some reason the AI duplicated state for simulation logic between js and c. This is why I needed the bridging module, to scrap the js part of the engine.
Another thing was memory. The AI initially wanted to use these massive structs for every single cell which was eating up memory. I had to tell it to pack the alive state and neighbor counts into a bit array.
The processing loop was also unoptimized at first. The agent basically wrote a brute force loop that checked every cell 60 times a second even if the board was completely empty. I had to step in and divide the grid into chunks so it tracks active zones and completely skips processing dead space.
For the visuals, it originally tried rendering physical borders around every single box geometry. I directed it to use a single instanced mesh instead and bake the cell grid outlines directly into the cell sprite using custom shaders. I also had it make dead cells completely transparent so you can see through.
State management in react was another headache. The AI threw the player points into a global context, which meant the entire 3D canvas and UI was re-rendering every time a cell died and awarded a point. Had to scrap that and build a custom subscription store just for the points text so it bypassed the react tree.
Finally, getting the game of life rules to wrap seamlessly around the 3D edges of the cube was tricky. We ended up using a synchronized halo buffer around each face that mirrors the adjacent faces using pure integer math to avoid float issues.
Would love to hear what you guys think and any feature suggestions. PS you can click "NEON LIFE 3D" 5 times to enter debug mode and get a better idea of the game, warning it's bright.
Here's the github:
https://github.com/Ifterbi/Neon-Life-3D