A browser-native C++ IDE — compile and run C++ code entirely client-side, no server required.
Zenith C++ is a fully client-side C++ compiler and execution environment that runs entirely in the browser. It uses Clang/LLVM compiled to WebAssembly as its compilation engine — meaning your code never leaves your machine. Zero backend, zero round-trips.
- In-browser compilation via Clang/LLVM ported to WebAssembly
- Monaco Editor (the VS Code engine) with C++ syntax highlighting and IntelliSense
- Xterm.js terminal for realistic
stdout/stderroutput - Web Worker isolation — the compiler runs on a separate thread, keeping the UI responsive
- IndexedDB caching — the ~30MB Wasm binary is cached locally after the first load
- Virtual File System via Emscripten's
MEMFS— simulates a local compile environment entirely in memory - Infinite loop protection via a Stop button that terminates the worker
- Minimalist dark UI — deep slate background, neon green accents, electric blue highlights
| Layer | Technology |
|---|---|
| UI & Styling | HTML5, Tailwind CSS |
| Code Editor | Monaco Editor |
| Compilation Engine | cpp-wasm / wasm-clang (Clang/LLVM → Wasm) |
| Terminal | Xterm.js |
| Concurrency | Web Workers |
| Persistence | IndexedDB |
| Runtime | Emscripten MEMFS (Virtual FS) |
| Deployment | Vercel |
zenith-cpp/
├── css/
│ ├── landing.css # Landing page styles
│ └── style.css # Global styles
├── js/
│ ├── compiler-worker.js # Web Worker: loads Wasm binary, runs compilation
│ ├── editor.js # Monaco Editor init, C++ theme, code extraction
│ ├── terminal.js # Xterm.js config, stdout/stderr piping
│ ├── jscpp-entry.js # JSCPP integration entry point
│ ├── jscpp.bundle.js # Bundled JSCPP runtime
│ └── main.js # App bootstrap and event wiring
├── index.html # Main IDE layout (editor + terminal split)
├── compiler.html # Compiler-specific view
├── server.js # Dev server with required COOP/COEP headers
├── vercel.json # Vercel deployment config with security headers
├── package.json
└── README.md
Main Thread
├── Monaco Editor (code input)
└── Xterm.js (output display)
│ postMessage (source code)
▼
Compiler Web Worker
└── Clang Wasm Binary
└── Emscripten MEMFS (Virtual FS)
├── writes → input.cpp
├── compiles → output.wasm
└── executes → stdout / stderr
│ postMessage (output)
▼
Main Thread → Xterm.js renders result
- Bun (or Node.js v18+)
git clone https://github.com/your-username/zenith-cpp.git
cd zenith-cpp
bun install
bun run server.jsThen open http://localhost:3000.
Note: You must run through the provided server (or any server that sets the required headers below). Opening
index.htmldirectly viafile://will not work.
Zenith C++ uses SharedArrayBuffer for Wasm threading, which requires the page to be cross-origin isolated. The following HTTP headers must be set on every response:
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin
These are already configured in server.js and vercel.json. If you deploy to a different host, make sure your server sets these headers or the compiler will not initialize.
On first load, the Clang Wasm binary (~30MB) is fetched from the network and stored in IndexedDB. On every subsequent visit, it's loaded directly from the local cache — making cold starts fast and completely offline-capable after the first load.
MIT — do whatever you want with it.
