Lightweight · Explicit · Imperative
Build Imperative,Explicit UIs.
A lightweight imperative DOM framework. Mutate plain state, call update() when you're ready, and let Nuclo sync the DOM without proxies, signals, or virtual DOM.
app.ts
import 'nuclo';
let count = 0;
const counter = div(
h1(() => `Count: ${count}`),
button('Increment', on('click', () => {
count++;
update();
}))
);
render(counter, document.body);
0deps
Zero DependenciesNo third-party packages. Pure DOM, pure performance.LIVE DEMOInteractive
0even
LIVE COUNTER⚡
TypeScript-FirstFull type definitions for 140+ HTML and SVG tags. Catch errors at compile time, not runtime.140+
HTML & SVG TagsEvery standard element as a global builder function. No imports needed.🎯
Fine-Grained UpdatesCall update() and Nuclo only touches DOM nodes whose resolved values changed. Elements are reused, branches stay mounted.INSTALL VIA NPMnpm install nuclo
Quick StartUp and running in 30 seconds.
⬛
STEP 01InstallOne command. Zero config. Ready to build.$npm install nuclo
💻
STEP 02Import & UseImport once globally. Every HTML tag becomes a function. Build UI with pure JavaScript.import 'nuclo';
const app = div(
h1('Hello, Nuclo!'),
p('Building UIs.')
);
render(app, document.body);
// tsconfig.json
{
"compilerOptions": {
"types": ["nuclo/types"]
}
}
📐
STEP 03TypeScript ReadyAdd one line to your tsconfig and get full autocomplete, type checking, and IntelliSense for every tag.🚀
You're Ready!That's it. Three steps to build imperative, explicit UIs with zero abstractions.ExamplesPractical examples with interactive live demos.