Reactive UI, woven from Effect.

Weft is an Effect-native reactive DOM library — streams drive every update, on the server and in the browser, with no virtual DOM and no JSX.

Live — click to increment
0

No virtual DOM

Streams update the DOM directly — no diffing, no reconciliation.

No JSX, no plugins

Plain h.* calls; components are functions you call. No build-time transform.

Effect-native

Every node is an Effect<…, E, R> — error and requirement channels flow through the tree.

Flash-free SSR

Server and client render identical trees; hydrate() resumes reactivity in place.

A component is a function. State is a stream.

ts
import { Component, h } from "@weftui/core";
import { Stream, SubscriptionRef } from "effect";

// A counter: a SubscriptionRef signal whose .changes stream
// drives the text node directly — no virtual DOM, no diffing.
const Counter = Component.gen(function* () {
  const count = yield* SubscriptionRef.make(0);
  return yield* h.button(
    { onclick: () => SubscriptionRef.update(count, (n) => n + 1) },
    [Stream.map(count.changes, String)],
  );
});