actions & effects

action — event handlers and mutations

action inc() { count = count + 1 }
action async save() {
  await store.persist()
  analytics.track("saved")
}

An action is a named handler you wire into the view (onClick={inc}). Assignments to state/store fields inside an action are reactive writes. action async handles promises; the compiler wraps it appropriately.

mount — run on mount

mount { analytics.track("page.view") }

mount runs once when the component mounts (a useEffect with an empty dependency list).

effect on(...) — react to reactive changes

effect on(store.isDirty) {
  document.title = store.isDirty ? "* Edit" : "Edit"
}

effect on(deps) runs when any listed reactive dependency changes. List exactly the dependencies you mean — the compiler builds the dependency array for you, so there’s no stale-closure footgun.

command — async writes (forms, optimistic UI)

command like() => api.toggle() optimistic { liked = !liked } rollback(e) { /* … */ }

command is the write-side counterpart to resource. The arrow form compiles to useTransition with optional optimistic / invalidate / rollback clauses; the block form (command save() { ... }) compiles to useActionState and exposes save.pending / save.result / save.error for use in forms.

Next: stores & scopes.