building an atomic bomberman clone, part 4: react vs. the game loop

The server was running. The Rust was making sense. But on the client side, I had a problem I hadn't anticipated: React and real-time rendering don't want the same things. React is built around a simple idea — your UI is a function of state. State changes, React re-renders, the DOM updates. It's elegant, and it's the mental model I've used for years. But a game renderer running at 60fps doesn't work this way. You don't want to trigger a React re-render every 16 milliseconds. You want to reach into a canvas and move pixels directly. This post is about mounting an imperative game engine inside a declarative framework, and all the places where the two models clash. the escape hatch React gives you exactly one way to say "I need to touch something outside the React tree": useRef plus useEffect. The ref gives you a DOM node. The effect gives you a place to run setup code that React won't interfere with. Here's the skeleton: function App() { const canvasRef = useRef<HTMLDivElement>(null