Core API
The five functions that power every Nuclo application: update(), render(), on(), list(), and when().
update()
Runs one synchronous update pass across the application. Call it once after all state mutations.
Nuclo does not auto-detect mutations — you decide when the DOM syncs.
Zero-argument bindings, list providers, and when() conditions re-evaluate.
Safe to call multiple times; prefer grouping work first.
render()
Mounts an element tree into a DOM container. Appends rather than replaces — run it once at app startup.
Typical pattern: render one root element that owns the whole app.
Multiple trees are supported but rarely needed.
Works with any element returned by the tag builders.
on()
Returns a modifier that attaches a typed event listener to any element. Full TypeScript inference for every DOM event.
Accepts any standard EventTarget event name.
Optional third argument maps to addEventListener options like once, passive, and capture.
Multiple on() calls on the same element are all registered.
list()
Synchronizes an array of objects to DOM nodes. Items stay mounted while their object identity remains stable.
provider is a zero-arg function returning the current array and re-evaluates on update().
renderer(item, index) builds the DOM for each item.
Items are tracked by object identity, so mutate in place when possible.
when()
Conditional rendering with DOM preservation. Chain .when() branches and finish with .else() for the fallback.
condition is a zero-arg function re-evaluated on every update().
The first truthy branch wins, and its DOM persists while that branch stays active.
Each branch can render multiple children, not just a single node.