TL;DR — A Fitz LiveViews component is a single .fitzv file. The interesting part: the same file compiles to two different targets with no rewrite. Server-rendered (SSR) — the server holds the state, renders HTML, and patches the browser over a WebSocket; best for shared, DB-driven, multi-user state. Client-WASM — the same component compiles to WebAssembly and runs entirely in the browser; best for offline, zero-round-trip widgets. This post builds a counter and ships it both ways. (Part 2 of the FitzLiveViews series — start here if you missed part 1.) In part 1 I made the pitch: real-time UI in one language, no JavaScript build. Now let's build something and ship it two ways from the same source. The component Here's a counter as a single-file component ( .fitzv ) — state, events, template, style: component Counter { state { count: Int = 0 }
event increment() { count = count + 1 } event decrement() { count = count - 1 } event reset() { count = 0 } #counter-app { padding : 1.5rem ; font-family : system-ui ; } button { padding : 0.5rem 1rem ; margin : 0 0.25rem ; } } state is the reactive data. Each event handler mutates it directly — no setState , no reducers.


