Browsercraft

A tiny Minecraft-style voxel game that runs entirely in the browser. No build step, no server — just static files.

Play

Serve the folder with any static file server (ES modules require http://, they do not load from file://):

cd browsercraft
python3 -m http.server 8080

Then open http://localhost:8080.

Controls

Input	Action
Mouse	Look around
W A S D	Move
Space	Jump / swim up / fly up
Shift	Sprint · descend while flying
F	Toggle fly mode
P	Release mouse (take screenshots with Cmd+Shift+4) — press again or click to recapture
Left click	Mine block
Right click	Place block
Middle click	Pick block into hotbar
Mouse wheel / 1–9	Select hotbar slot
Esc	Pause

While pointer-locked your mouse is captured by the game, so macOS shortcuts like Cmd+Shift+4 can't reach it — press P to release the mouse without leaving the game.

World

• Infinite procedural terrain from a seed: plains, forests, deserts with cacti, snowy mountains, lakes and seas
• Underground caves with coal and iron ore veins
• Trees, flowers, tall grass; drifting clouds; underwater fog & tint
• Swimming physics, sprinting, creative-style fly mode

Tech notes

• Three.js r160 (vendored ES module)
• Vanilla JS, no bundler: native ES modules + import map
• Chunked world (16 × 80 × 16 Uint8Array chunks) streamed around the player with face-culled meshing and per-face shading via vertex colors
• All textures generated at runtime into a canvas atlas — zero image assets
• Voxel raycasting (Amanatides & Woo DDA) for mining/placing
• Deterministic generation: same seed string → same world every reload

Automated playtest

A headless-Chrome CDP script loads the game, plays it (move, jump, mine, place, fly, swim), and asserts 17 behaviors:

python3 -m http.server 8080 &   # if not already serving
node scripts/playtest.mjs --out /tmp/bc-shots

There is also a diagnostic probe that teleports to a position and reports mesh/data integrity (scripts/diagnose.mjs).

Screenshots land in /tmp/bc-shots, results in report.json.

Project structure

browsercraft/
├── index.html          # shell, import map, UI overlays
├── style.css           # menu, hotbar, crosshair, HUD styling
├── lib/
│   └── three.module.js # vendored Three.js r160
├── scripts/
│   └── playtest.mjs    # headless automated playthrough
└── src/
    ├── main.js         # renderer, chunk streaming, input, game loop
    ├── world.js        # chunks, biomes, terrain gen, mesher
    ├── player.js       # FPS physics, swim/fly, voxel raycast
    ├── noise.js        # seeded value/fBm + 3D hash noise
    ├── blocks.js       # block registry + material flags
    └── textures.js     # runtime canvas texture atlas