Choosing tools for developing a browser-based video game.

State management

Given the complexity of a video game, a robust state management approach is required. The finite-state machine (FSM) model, refined since the 1940s, is well-suited for managing this level of complexity. XState is the most mature library that implements FSM in JavaScript, making it an ideal choice.

Rendering 3D

A large part of the game involves exploring space and I think a 3D environment will be the best way to visualize this. The two most popular tools for rendering 3D graphics in the browser are Three.js and Babylon.js. I chose Three.js because it provides a lower-level abstraction of WebGL, offering greater flexibility for experimentation.

UI Library

I often use React for prototyping because:

• ▪ composing an app with components is like building with Lego. Great for reusablility, scaling and debugging,
• ▪ its simple rendering approach based on state change.

Conflicting rendering approaches. React minimizes re-renders, updating only when necessary based on state changes. Three.js, by contrast, re-renders at ~60 times (frames) per second, irrelevant if state changed or not. While react-three-fiber is designed to bridge this gap, I found myself fighting against the system when prototyping.

Abstraction. Three.js abstracts WebGL. React-three-fiber abstracts Three.js. More abstraction means less control and more workarounds to achieve uncommon behavior. Since this project prioritizes experimentation, I want maximum flexibility.

Instead of using React, I'll take a vanilla Typescript functional programming approach for UI rendering. I haven't attempted this for a complex project before, however, my hypothesis is XState should be sufficient to manage complexity.

CSS

Vanilla CSS will handle styling. Unscoped CSS can become an issue as complexity grows but CSS nesting might be enough to avoid this.

To be continued...

This game is under development and will continue to be documented in future notes.

Feedback

Have any feedback about this note or just want to comment on the state of the economy?