Weft

Reactive UI, woven from Effect

Get started GitHub

Weft is an Effect-native reactive DOM library. Streams drive every update, on the server and in the browser.

Live: click to increment

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.

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)],
  );
});