Live demo: https://substrate-webgpu.netlify.app/

Terrain generation system built with WebGPU that leverages compute shaders for GPU-accelerated mesh generation.

• Node.js 18+
• pnpm package manager
• WebGPU-compatible browser (Chrome 113+, Edge 113+, or Firefox with WebGPU enabled)

# Clone the repository
git clone <repository-url>
cd substrate

# Install dependencies using pnpm
pnpm install

# Start development server
pnpm dev

# Build for production
pnpm build

# Preview production build
pnpm preview

The terrain generation uses a multi-stage GPU compute pipeline:

1. Index Generation (index-generation.wgsl) - Generates triangle indices for tessellated quads
2. Tessellation Compute (tessellation-compute.wgsl) - Creates vertex positions, normals, and UV coordinates
3. Render Pipeline (tessellated-quad.wgsl) - Renders the terrain with lighting, fog, and optional wireframe

• GpuTessellator - Manages compute shader execution for mesh generation
• GpuTessellatedQuadPipeline - Handles the rendering pipeline and GPU buffer management
• Terrain - Manages terrain uniforms and wireframe state
• Camera - Orbit camera with pan, rotate, and zoom controls
• Gui - Tweakpane interface for real-time controls

• Mouse Left Drag - Rotate camera
• Mouse Right/Middle Drag - Pan camera
• Mouse Wheel - Zoom in/out
• WASD Keys - Pan camera

MIT License