Component Lifecycle Work
Attach mount, cleanup, and DOM-only work to the component lifecycle so server rendering stays deterministic.
Example
Use a resource for cancellable work whose lifetime belongs to the current component render and dependencies.
import { resource } from '@askrjs/askr/resources';
const project = resource(
({ signal }) => api.projects.get(projectId(), { signal }),
[projectId]
);Resources and tasks
resource(fn, deps) from @askrjs/askr/resources runs async work tied to a dependency list and returns { value, pending, error, refresh() } — it reruns automatically whenever deps changes and exposes a refresh() you can call manually. task(fn) is the lower-level primitive for scheduling work as part of a component's lifecycle; the function you pass can itself return a cleanup function or a promise resolving to one, which the runtime calls when the task needs to unwind.
Events and streams
on(target, event, handler, options?) attaches a DOM event listener scoped to the component's lifetime — it wraps addEventListener/removeEventListener so you don't have to write the teardown yourself. stream(source, options?) is the equivalent primitive for values over time, but it's not the same shape as resource — it returns { value, status, pending, stale, error, restart(), close() }, adding a status for connection state (connecting/connected/reconnecting/closed/error) and restart()/close() controls that a one-shot resource() call has no equivalent for.
Timers
timer(intervalMs, fn, options?) runs fn on an interval for as long as the component is mounted, and its when option accepts one or more activity predicates so the timer can pause itself — routeActive(path), documentVisible(), and windowFocused() are the built-in predicates for "only tick while this route is showing," "only while the tab is visible," and "only while the window has focus."
Cancellation and cleanup
resource's worker function receives a { signal } argument — an AbortSignal that fires when the dependencies change or the component unmounts, so an in-flight fetch(url, { signal }) cancels itself instead of racing a newer call. capture(fn) snapshots the result of a synchronous read at call time and returns a thunk to read it back later, which is the documented way to carry a consistent value into an async continuation without re-reading state that may have moved on.