Nuclo v0.2.21 · zero dependencies
Build explicitinterfaces withnuclo.
A tiny, type-safe DOM framework with plain mutable state and explicit updates. No proxies, signals, or virtual DOM.
$npm create nuclo@latest
0
dependencies
175
typed HTML & SVG builders
~14.2KB
gzipped, entire runtime
0
How it works
One explicit cycle.
State-dependent values, no dependency graph, no scheduler. You decide when they run - a single predictable path from your data to the screen.
Mutate
01Change your data
State is plain JavaScript - variables, arrays, objects. Mutate it however you like, as many times as you like.
Commit
02Call update()
One global function commits your changes. Batch a dozen mutations and commit once - nothing renders until you say so.
Patch
03Nuclo syncs the DOM
Every dynamic expression re-evaluates, and only values that actually changed are written to the DOM. No diffing, no re-renders.
Philosophy
When you mutate state, nothing happens. Call update() and Nuclo does exactly what you asked-no more, no less.
01
Explicit is better than implicit
No proxies tracking your every move. You mutate, you call update(). Clear causality, predictable behaviour.
02
Batch freely, update once
Make 10 mutations before calling update() once. The DOM sees only the final state-no wasted renders.
03
Functions, not components
Build with plain JavaScript functions. No lifecycle hooks, no class magic, no special syntax-just functions that return DOM nodes.
Features
Built for clarity.
No magic. No surprises. Every update is intentional.
01
EXPLICIT
You own the update cycle
Mutate freely, then call update() once. No subscriptions, no schedulers, no diffing surprises - the DOM syncs when you decide.
02
LIGHTWEIGHT
Zero dependencies
About 14.2 KB gzipped for the entire runtime. No compiler, no build plugins - add one import and start building.
03
TYPED
TypeScript-first
175 fully-typed HTML & SVG builders, with autocomplete for every attribute, style property, and event.
04
PRECISE
Fine-grained patching
Dynamic expressions re-evaluate on update(), and only the values that actually changed touch the DOM.
Benchmarks
Fast where it counts.
Independent numbers from js-framework-benchmark - creating, updating, swapping, and clearing thousands of rows.
js-framework-benchmark · keyedlower is better
Solid1.9.3
1.12
Svelte5.42.1
1.15
Vue3.6.0
1.28
Nuclo0.2.6
1.36
Riot10.1.2
1.54
React19.2.0
1.57
Angular22.0.0
1.64
Stencil4.23.0
1.79
Ember6.12.0
2.28
Knockout3.5.1
2.34
Qwik1.11.0
3.44
Duration slowdown vs. the fastest measured implementation - weighted geometric mean of all keyed benchmarks.Source: js-framework-benchmark ↗
Get Started
Ready when you are.
Install Nuclo, import it once, and ship UIs that update exactly when you say. The whole API fits in an afternoon.
$npm create nuclo@latest