Askr is a lane-scheduled UI runtime for TypeScript applications. Its single-threaded scheduler serializes queued framework work; it is not a message-passing actor system. Askr provides explicit reactivity, routed application startup, server-side rendering, and static-site generation entrypoints.
import { state } from '@askrjs/askr';
import { createIsland } from '@askrjs/askr/boot';
function Counter() {
const [count, setCount] = state(0);
return <button onClick={() => setCount((value) => value + 1)}>{count()}</button>;
}
createIsland({ root: document.body, component: Counter });The tuple form above and the direct callable form below are equivalent; see State usage forms for when each is convenient.
@askrjs/askr exports the core runtime primitives: state(), derive(),
selector(), defineScope(), readScope(), getSignal(), and the JSX
runtime exports.
Public APIs prefer functions and closures over classes. Lexical ownership uses
defineScope() and readScope(); there are no compatibility aliases for the
clean-break vocabulary.
App startup, routing, async resources, data helpers, and error boundaries live on their own subpaths.
State is read through getter functions and updated through setter functions.
state() returns one callable state cell that is also iterable. Destructuring
it gives the cell as the getter and its .set() method as the setter:
const [count, setCount] = state(0);
console.log(count());
setCount(1);The same state can be kept as one value and updated through .set():
const count = state(0);
console.log(count());
count.set(1);Prefer destructuring when local getter and setter names make event handlers clear. Prefer the direct form when passing the state cell around as one value or when keeping reads and writes under one name. Both forms have the same tracking, scheduling, and update semantics.
Startup belongs in @askrjs/askr/boot. Routing helpers live in
@askrjs/askr/router.
import { createSPA } from '@askrjs/askr/boot';
import { createRouteRegistry, route } from '@askrjs/askr/router';
const registry = createRouteRegistry(() => {
route('/', Home);
route('/about', About);
});
createSPA({
root: document.body,
registry,
});resource() manages async work with cancellation support.
import { resource } from '@askrjs/askr/resources';
function Data({ id }: { id: string }) {
const data = resource(async ({ signal }) => {
const response = await fetch(`/api/${id}`, { signal });
return response.json();
}, [id]);
if (data.pending) return <div>Loading...</div>;
if (data.error) return <div>Failed to load</div>;
return <div>{data.value.name}</div>;
}@askrjs/askr/data is the canonical entrypoint for all query, mutation,
invalidation, and data-runtime helpers. The root package retains query creation
and collection, definition and serving, prefetch, and hydration exports for
compatibility with existing applications. Mutation, invalidation, and
data-runtime control remain subpath-only. New code should import the whole data surface from
@askrjs/askr/data rather than split related imports across entrypoints.
ErrorBoundary is the opt-in boundary primitive for render-time failures. It
renders a visible fallback in every environment (with error details expanded
by default in development), still logs the underlying error, and can reset via
a resetKey tied to your app state. The boundary protects both initial mount
and scheduled post-mount updates. Portal content follows its logical writer
boundary and can also recover through a boundary around its host.
import { ErrorBoundary } from '@askrjs/askr/components';
function App() {
return (
<ErrorBoundary fallback={<div>Something went wrong</div>}>
<FlakyView />
</ErrorBoundary>
);
}- Documentation Index
- Installation
- Quick Start
- State Guide
- Router Guide
- Resources Guide
- SSG Guide
- Runtime Enforcement
- Determinism
- API Reference
The published package is versioned with the repository package.json.
Release workflows validate the version tag before publishing.
npm install @askrjs/askrApache 2.0