Mutate Everything: How StarKnightt/MineCraft Hits 60FPS in the Browser

The Immutability Trap

Modern web development preaches immutability. You do not mutate state; you copy it. But in a 3D voxel engine tracking thousands of blocks, copying a massive state object sixty times a second creates catastrophic Garbage Collection (GC) spikes. Standard React state management kills game loops.

Every time a player moves or breaks a block, an immutable state paradigm requires cloning the entire world data. This leads to massive memory allocation and inevitable stutter. The browser simply cannot keep up with the physics engine.

Mutating the Source of Truth

The project solves the React-Three-Fiber performance bottleneck by decoupling the massive world data from the React render cycle. It uses Zustand to store the state but intentionally configures it for high-frequency mutations. Instead of copying a 5,000-key object on every block break, the store mutates the `blocks` object directly.

To notify React of changes without passing a new object, the developer employs a simple `blockVersion` integer counter. Components subscribe to this number rather than the `blocks` object itself.

Zero-Allocation Geometry

The codebase goes to extreme lengths to avoid creating new JavaScript objects. The `fastPosKey` caching mechanism uses nested Maps to look up spatial coordinates without generating new string literals on every frame, keeping the GC completely silent.

Instancing the World

To render thousands of blocks, the engine abandons individual meshes. It uses Three.js `instancedMesh` via React Three Fiber, maintaining only one draw call per block type (Grass, Stone, Glass) and updating a transformation matrix array.

Web-Native vs. Emulation

Projects like Eaglercraft use WebAssembly and Java decompilation for perfect authenticity. StarKnightt proves that modern web primitives like Vite, React, and R3F can build a highly performant voxel engine from scratch.