Architecture

The core principle of R3F game development is separating game logic from rendering. React components are views, not the source of truth.

Systems vs Views

Systems contain all game logic:

• Movement, physics, collision detection
• Spawning and destroying entities
• State mutations (health, score, timers)
• AI and behavior
• Syncing Three.js objects with entity state

Views (React components) only render:

• <PlayerEntity>, <EnemyEntity> wrap models with ModelContainer, process any data needed and pass it as props to the model
• <PlayerModel>, <EnemyModel> are dumb and only render meshes via props
• They don't contain core game logic, just visuals logic