$ show reagent-project/reagent
Reagent is a ClojureScript library that provides a minimal, functional interface to React. Instead of JSX or React.createElement calls, components are defined as plain functions returning Hiccup-style vectors (e.g., [:div {:class "btn"} "Click"]), which Reagent compiles into React elements at runtime. The library adds a reactive state layer built on 'ratoms' (trackable atoms) and reactions: any deref inside a component render creates a dependency, and updates are batched asynchronously through requestAnimationFrame (or flushSync on React 19) before being flushed to the DOM. Production use centers on SPA frontends. The architecture is a small set of namespaces: reagent.core exposes the public API; reagent.dom and reagent.dom.client handle mounting into the browser (legacy vs createRoot); reagent.dom.server provides SSR; reagent.ratom implements cursors, track, and reactions; reagent.impl.template and reagent.impl.component handle Hiccup-to-React compilation and component lifecycle; reagent.hooks adapts React hooks to ClojureScript values. Reagent supports React 18 and 19, including functional components via the defc macro, class components, fragments, portals, error boundaries, and custom compilers. Because Reagent is a library rather than an app, its primary consumers are ClojureScript developers building frontends. Its most reusable assets are the state-management primitives and the Hiccup compiler, both of which are self-contained enough to be lifted into other projects. The repo also includes a demo application, example projects, and a test matrix that exercises React versions and build tools (shadow-cljs, webpack, Leiningen). The codebase shows mature engineering with clear separation between the public API and internal implementation, though some legacy references and documentation drift remain.
The LLM identified 4 files worth highlighting for reuse:
Implements Reagent's reactive atom, cursor, reaction, and track primitives. This is a self-contained state-management layer that tracks dereferences and propagates changes, and it can be extracted for any ClojureScript UI or general state orchestration problem. The cursor pattern is especially useful for limiting re-renders to subtree-scoped state.
The Hiccup-to-React compiler. It parses vector syntax, distinguishes tags, components, keywords, and properties, converts CSS-style keys to React prop names, and launches dynamic children. The custom Compiler protocol makes the conversion extensible, and the whole namespace is a strong example of a data-driven syntax compiler.
Clojure-friendly wrappers around React hooks (use-state, use-effect, use-memo, use-reducer, use-ref) using immutable value equality and Glue/JS interop. This namespace solves the recurring problem of making imperative JS hooks ergonomic in a functional language and is reusable in any ClojureScript React project.
A small render queue that batches before-flush, render, and after-flush callbacks using requestAnimationFrame or React 19's flushSync. It demonstrates a clean, timing-aware scheduling pattern that is decoupled from any specific UI framework and could be repurposed for other batching and coalescing problems.