Back to articles
Run Away From Work β€” Stopped Using React for the Game Loop

Run Away From Work β€” Stopped Using React for the Game Loop

via Dev.to Reactnyaomaru

Play the game here πŸ‘ˆ Hi there! I’m @nyaomaru , a frontend engineer who got Resident Evil 9 from NVIDIA and is still too scared to make it to the first zombie. 🧟 In my previous article, I introduced my small browser game, Run Away From Work . At first glance, it looks like a very simple game. But while building it, I realized something important: If you design the game around setState on every frame, it falls apart very quickly. Every frame becomes: setState β†’ re-render β†’ diff β†’ DOM update And if you try to do that at 60fps, it gets heavy fast. That does not mean React is bad for games. It means this is the wrong place to use React’s rendering model. So in this article, I want to share how I changed the architecture: I used React for the structure and direct DOM manipulation for high-frequency game updates 🐾 Quick recap This game was built with: Remix React TypeScript Feature-Sliced Design If you want the overview of the project itself, here is the previous article: I Built a β€œRun Away

Continue reading on Dev.to React

Opens in a new tab

Read Full Article
7 views

Related Articles