Electron-shaped, but the rendering pipeline is ours: QuickJS, a custom layout engine, Skia, and OpenGL. So 3D, physics, audio, game networking, and on-device AI/ML wire straight into the DOM, in one process, no IPC to a Chromium renderer.
<!-- a bro app is just a folder with an index.html --> <h1 id="msg">Hello</h1> <button id="btn">Click me</button> <script> document.getElementById('btn').addEventListener('click', () => { document.getElementById('msg').textContent = 'Hello, bro'; }); </script>
$ bro path/to/hello
Why it exists
Coding agents build web UIs really well. Native UIs take more debugging to get right. Electron solves that, but only for what the web platform natively supports.
In bro, HTML/CSS/JS is the UI/app layer like Electron. But the rendering pipeline is ours, which means we can plug in whatever we want underneath. And we have: a 3D scene graph, Jolt physics, a real-time audio engine, mesh generation and CSG, navmesh pathfinding, game networking over GNS, and a full on-device AI/ML inference stack. All of it is exposed to JS, all running in one process, no IPC to a Chromium renderer.
None of this is new. It's a reconfiguration that works better for coding agents.
Rendering parity vs Chromium
HTML and CSS are rendered by our own engine, not by embedding Chromium. Broparity is a side-by-side test suite that compares bro's output to Chromium, pixel-by-pixel and structurally, on a curated set of layout cases.
What you get
Every surface below is exposed to JavaScript and documented in the reference.
HTML5 parsing, CSS (flexbox, gradients, border-radius, overflow/scroll), SVG, Canvas 2D, WebGL 2.0, Web Components with Shadow DOM, Web Workers, Fetch, localStorage, and form controls with real text editing. three.js and jQuery work.
A 3D scene graph with mesh rendering, skinned characters, height-field and clipmap terrain, tile grids, PBR lighting, procedural mesh generation and CSG, SIMD noise, an ecosystem sim, and transform gizmos for editing.
Jolt rigid-body physics with contact events, wired into the scene graph. A real-time Web Audio engine with synthesis, effects, spatialization, and MIDI, plus live mic capture.
Navmesh and A* pathfinding, steering, and perception for game agents. Peer-to-peer game networking over Valve's GameNetworkingSockets, plus a headless bro-server for dedicated servers. Native file dialogs, menu bars, and Steamworks.
GPU-accelerated model inference wired into JS: CUDA or Metal with a CPU fallback (bro.gpu probes the live backend). A unified tensor type and op set underpins text generation, diffusion, speech, and vision, all running locally, no server.
Headless mode runs the full pipeline (GPU, real fonts, WebGL) without a window, driven by JS with virtual time for deterministic testing. A DOM inspector, settings system, and line-coverage reports round it out.
Naked bro opens a built-in project manager. The launcher and a curated set of starter apps live in the sibling broworkshop repo: games, tools, demos, and AI/research apps you can clone and reshape.
Architecture
HTML is parsed into a single DOM, CSS resolved by a cascade, layout computed, and the tree rasterized by Skia through its Ganesh GL backend, then composited with the 3D scene layer as textured quads in an OpenGL 3.3 core context. The subsystems stack:
Each piece lives in its own sibling repo so it can be used independently of bro:
Plus Jolt for physics, Skia for rasterization, SDL3 for windowing and GL contexts, and QuickJS as the JS engine.
Every API surface, from audio and scene to physics, mesh, networking, and AI/ML, is documented as an annotated .js file with JSDoc and usage examples. Guides cover headless mode, settings, the inspector, projects, and multi-repo workflow.