Outcome: identify which subsystem owns runtime, authoring, interface, intelligence, and operating-shell work.
The engine owns WebGPU, ECS, rendering, timing, and simulation. Editor provides authoring, Plauna provides hybrid interfaces, AGI provides tensor and training systems, and WebGPU OS composes the stack.
Begin at the engine. It owns the GPU, entity world, rendering, timing, and simulation primitives.
Editor and Plauna are authoring and interface surfaces. They consume the engine instead of replacing it.
AGI adds WebGPU tensor and training systems. WebGPU OS composes every layer into an operating shell.
Build upward through the stack, then trace failures downward.
2. Launch locally 2 minute lab
Outcome: start the repository at port 9001 and open a module from the same HTTP origin.
Run python start_server.py from the repository root, then open http://127.0.0.1:9001/tests/learn/. Native browser modules do not run correctly from a file URL.
Run the repository’s Python server from its root. No package installation is required.
Use port 9001; a file URL prevents the browser module graph from loading correctly.
Every engine import remains inspectable because the browser receives native ES modules.
3. GPU device 4 minute lab
Outcome: acquire an engine GPU wrapper with compatibility-first, core fallback, and a device-loss handler.
WebGPU compatibility mode is an adapter feature level. If it is unavailable, retry the engine wrapper with the default core path. A device-loss handler must reveal a usable fallback.
Ask the engine wrapper for the browser’s compatibility feature level when available.
If it is rejected, retry through the default core adapter path.
Surface the selected path as telemetry.
Treat device loss as normal lifecycle and invoke an application-owned fallback.
4. Canvas surface 4 minute lab
Outcome: create a responsive WebGPU canvas without hand-rolling browser resize plumbing.
createCanvasSurface() binds an engine device to a canvas and owns device-pixel sizing, context format, resize observation, and cleanup.
Create the surface with an engine wrapper, canvas selector, and explicit presentation options.
Automatic device-pixel sizing keeps the backing texture crisp.
Use the surface’s browser context and preferred format.
Destroy the surface when its view leaves.
5. ECS world 6 minute lab
Outcome: create an entity, attach a normalized Transform, advance the world, and inspect its receipt.
Entities are generation-safe IDs, components contain normalized data, and scheduled systems advance matching archetypes through ordered world phases.
A minimal world has time, ordered phases, system metrics, and generation-safe IDs.
Creating an entity allocates identity and attaching Transform selects its archetype.
Component constructors normalize data before storage.
A world step advances time and produces inspectable stats.
6. Shader pipeline 6 minute lab
Outcome: compile a WGSL module and create a pipeline against the surface’s real browser format.
The browser compiles and renders the exact visible WGSL: one oversized triangle and an analytic horizon, ring, and lattice fragment signal.
An oversized triangle covers the viewport without a vertex buffer.
The fragment stage reads coordinates and bounded lesson uniforms.
The active device compiles the module and exposes compilation messages.
The surface supplies the render target format.
7. Frame loop 5 minute lab
Outcome: understand the update and render order driving the live Academy canvas.
Clamp time, advance canonical ECS state, write presentation uniforms, encode a pass against the current texture, submit, expose telemetry, and repeat.
Clamp frame delta before it enters simulation.
Advance canonical world state before presentation uniforms.
Acquire the current texture only while encoding the pass.
End, submit, expose telemetry, and schedule the next frame.
8. Playground and WebGPU OS 3 minute lab
Outcome: open a deep-linked demo and distinguish browser compatibility mode from the Chrome Companion extension.
Compatibility mode changes the WebGPU feature level. Playground hosts focused experiments. WebGPU OS composes mature capabilities. Companion is a separate, optional browser bridge available from the Chrome Web Store.
Compatibility mode broadens the WebGPU adapter path.
Playground makes focused experiments observable and shareable.
WebGPU OS composes mature engine, interface, and application capabilities.
Chrome Companion is a separate optional bridge for WebGPU OS workflows.