Strata Game Library

Layer by Layer, World by World. The complete game framework for building procedural 3D worlds. Terrain, water, vegetation, sky, physics, AI — everything you need to ship immersive games and experiences in React Three Fiber.

Get Started API Reference View on GitHub

Interactive — drag to rotate

“Build complete 3D worlds in under 1,000 lines of code. Layer by layer, from shaders to game logic — Strata handles the complexity so you can focus on creating.”

What You Can Build

🏔️

Procedural Terrain

SDF-based terrain with marching cubes, triplanar texturing, multi-biome blending, erosion simulation, and dynamic LOD. Create infinite worlds that feel alive.

Core

🌊

Advanced Water Systems

Realistic water with Gerstner waves, Fresnel reflections, underwater caustics, procedural foam, and depth-based transparency. Oceans, rivers, and lakes.

Core

🌿

GPU Vegetation

Render 10,000+ instances at 60fps with GPU-accelerated instancing, procedural wind animation, seasonal changes, and biome-based distribution.

Core

☀️

Procedural Sky & Atmosphere

Physically-based atmospheric scattering with dynamic day/night cycles, volumetric clouds, stars, and horizon fog. Beautiful at every time of day.

Core

🌫️

Volumetric Effects

God rays, volumetric fog, underwater overlays, dust particles, and atmospheric haze. Depth and mood for every scene.

Shaders

🎮

Game Framework

ECS architecture, physics integration, AI pathfinding, state management, animation system, and audio engine. Everything to ship a complete game.

Framework

The Strata Difference

Without Strata

With Strata

// Traditional Three.js terrain setup
// 200+ lines of boilerplate...
const geometry = new THREE.BufferGeometry();
const vertices = [];
const noise = createNoise2D();

for (let x = 0; x < width; x++) {
  for (let z = 0; z < depth; z++) {
    const y = noise(x * 0.05, z * 0.05) * 20;
    vertices.push(x, y, z);
  }
}

geometry.setAttribute('position',
  new THREE.Float32BufferAttribute(vertices, 3)
);

const material = new THREE.ShaderMaterial({
  vertexShader: `// 100+ lines of GLSL...`,
  fragmentShader: `// 150+ lines of GLSL...`,
  uniforms: { /* ...dozens of uniforms */ }
});

// Still need: LOD, biomes, erosion,
// triplanar texturing, physics...

// With Strata — the same result in 3 lines
import { Terrain } from '@strata-game-library/core';

<Terrain
  biome="alpine"
  size={256}
  resolution={128}
  erosion={true}
  lod={{ levels: 4 }}
/>

// That's it. Biomes, erosion, triplanar
// texturing, LOD, physics colliders —
// all included and optimized.

The Numbers

10x

Code Reduction

vs. raw Three.js

Packages

modular ecosystem

989

Tests Passing

comprehensive coverage

60fps

Target Performance

GPU-optimized

Capability	Without Strata	With Strata	Reduction
Terrain System	2,000+ lines	~50 lines	40x
Water Rendering	1,500+ lines	~20 lines	75x
GPU Vegetation	1,000+ lines	~30 lines	33x
Sky & Atmosphere	800+ lines	~15 lines	53x
Full Game Scene	5,000+ lines	~200 lines	25x

Quick Start

Install the core package and peer dependencies:

pnpm install @strata-game-library/core @react-three/fiber @react-three/drei three

Build a complete scene in minutes:

import { Canvas } from '@react-three/fiber';
import {
  ProceduralSky,
  Water,
  GrassInstances,
  VolumetricFogMesh,
} from '@strata-game-library/core';

function Game() {
  return (
    <Canvas camera={{ position: [0, 10, 20] }}>
      <ProceduralSky sunPosition={[100, 50, 100]} />
      <Water size={200} depth={20} />
      <GrassInstances count={10000} spread={100} />
      <VolumetricFogMesh density={0.02} />
    </Canvas>
  );
}

Customize with presets or go fully declarative:

import { TerrainPresets, WaterPresets } from '@strata-game-library/presets';

<Terrain preset={TerrainPresets.Alpine} />
<Water preset={WaterPresets.CalmOcean} />

Architecture

Strata is built in layers — each one building on the last, like geological strata:

Layer 4Presets & Game FrameworkcreateGame(), scenes, modes, AI behaviors

Layer 3React Three Fiber ComponentsTerrain, Water, Sky, Vegetation, Characters

Layer 2Core AlgorithmsSDF, Noise, Marching Cubes, Pathfinding, ECS

Layer 1GLSL ShadersTerrain, water, sky, volumetrics, materials

Layer 0TypeScript Types & UtilitiesType-safe foundation for everything above

Every layer is independently usable. Import just the shaders, or use the full framework — it’s your choice.

Package Ecosystem

@strata-game-library/coreMain

Terrain, water, vegetation, sky, characters, ECS, physics, AI, animation, and audio. The heart of Strata.

@strata-game-library/shaders

Standalone GLSL shader collection. Use with any Three.js project — no React required.

@strata-game-library/presets

Production-ready configurations for terrain biomes, weather systems, water types, and more.

@strata-game-library/audio-synthNew

Procedural audio synthesis and spatial sound design for immersive game audio.

@strata-game-library/model-synthNew

AI-powered 3D model generation. Create game assets from text descriptions.

Mobile Plugins

React Native and Capacitor plugins for cross-platform games with unified input and haptics.

The Vision

“Games should be defined, not engineered. Strata’s goal is to make building 3D worlds as natural as writing a document — declarative, composable, and beautiful by default.”

The upcoming createGame() API will enable fully declarative game definitions:

import { createGame, StrataGame } from '@strata-game-library/core';

const game = createGame({
  world: {
    terrain: 'alpine',
    water: { type: 'ocean', depth: 50 },
    vegetation: { density: 0.8, season: 'summer' },
    sky: { timeOfDay: 14, weather: 'partly-cloudy' },
  },
  creatures: [otter, deer, eagle],
  modes: { exploration, racing, combat },
  state: 'rpg',
});

<StrataGame game={game} />

Live Showcase

Experience Strata in action:

Terrain Demo Procedural terrain with biomes, caves, erosion, and dynamic LOD

Water Demo Ocean rendering with reflections, caustics, foam, and underwater effects

Vegetation Demo GPU-instanced grass, trees, and rocks with seasonal wind

Sky & Volumetrics Day/night cycle, clouds, god rays, and atmospheric haze

Part of jbcom

Strata is the Games & Procedural division of the jbcom enterprise, building alongside:

Agentic AI & Machine Learning — intelligent systems and autonomous agents

Extended Data Infrastructure & Data Engineering — the backbone of modern applications