reactive · compiled · full-stack

The reactive framework
you can see.

Fluixi compiles your JSX to fine-grained DOM updates on a TC39-Signals core — then gives you SSR, streaming, SSG, server functions, routing, DI and i18n in one coherent stack.

$npm create fluixi@latest
Counter.tsx
function Counter() {
  const [count, setCount] = createSignal(0);
  const doubled = createMemo(() => count() * 2);

  return (
    <button onClick={() => setCount(c => c + 1)}>
      {count()} · {doubled()}
    </button>
  );
}

Everything a modern app needs

One framework, from the signal graph to the edge.

Fine-grained reactivity

A TC39-Signals graph updates exactly the DOM that changed — no virtual DOM, no diffing, no re-renders.

ƒ

Compiled, not interpreted

JSX compiles straight to imperative DOM calls. You ship the work, not a runtime that re-discovers it.

SSR + streaming

Request-scoped server rendering with web-stream output and seamless hydration — isolated per request.

Static generation

Set `prerender` and `fluixi build` crawls your routes to static HTML — this very page is SSG.

File-based routing

Routes from the filesystem, nested layouts, lazy loading, data loaders — with a framework-agnostic core.

Server functions & actions

`"use server"` turns a function into a typed RPC; forms get progressive-enhancement actions.

API routes & middleware

Drop a handler in `src/api/**` for `/api/*`; a middleware chain runs before every render.

DI, i18n, interceptors

Angular-style dependency injection, built-in typed i18n, and an HTTP interceptor pipeline.

Islands & edge

Partial hydration for mostly-static pages, and an edge-safe server that runs on Workers, Deno and Bun.

The server is just a function away.

Mark a function "use server" and the compiler strips its body from the browser, leaving a typed RPC stub. Secrets, database calls and your API keys never ship to the client.

  • Request-scoped context, cookies and headers
  • Form actions with progressive enhancement
  • File-based API routes at /api/*
user.ts
// runs only on the server — the body is stripped from the client bundle
async function getUser(id: string) {
  "use server";
  return db.users.find(id); // secrets stay server-side
}

// call it from anywhere like a normal async function:
const user = await getUser("42");

See your reactivity.

The Fluixi Playground compiles JSX in your browser and renders the live dependency graph — watch state, memos, stores and effects light up as they propagate.

Try the Playground →