fre
:ghost: Tiny Concurrent UI library with Fiber.
Fre is a tiny React-like JavaScript library for building browser UIs with JSX, hooks, and Suspense. Its standout feature is a concurrent renderer that keeps the page responsive during complex updates by processing work in small chunks instead of one big blocking operation.
Fre is a small JavaScript library for building user interfaces in the browser. It works similarly to React in that you build your UI out of components, use JSX syntax (an HTML-like shorthand embedded in JavaScript), and manage state through functions called hooks. The library is deliberately tiny, which means less code is sent to users' browsers.
The library's main technical feature is a concurrent mode scheduler. This means Fre can pause and resume rendering work in small chunks rather than blocking the browser with one large update. The project describes this as a coroutine scheduler inside JavaScript, and it is also called time slicing. The result is a UI that can stay responsive even during complex updates. Fre implements this using a fiber-based internal structure, which is where its name comes from.
Fre includes a hooks API that mirrors React's: useState, useEffect, useReducer, useLayout, useCallback, useMemo, useRef, and useContext are all available. It also supports Suspense (for lazily loading components that have not been fetched yet), ErrorBoundary (for catching rendering errors in one part of the page without crashing the whole UI), and Fragments (for grouping multiple elements without adding extra HTML wrapper elements).
Installing Fre is done via npm or yarn. It supports JSX and can be configured for use with Vite by setting a few build options. The keyed reconciliation algorithm it uses for tracking changes to lists is described in the README as minimal and as supporting preprocess and offscreen rendering as well. The project is open source under the MIT license.
Where it fits
- Build a lightweight browser UI with React-like components and hooks when bundle size matters.
- Drop Fre into a Vite project as a smaller alternative to React with the same JSX workflow.
- Implement a UI that stays responsive during heavy re-renders using Fre's concurrent scheduler.
- Use Fre's Suspense and ErrorBoundary support to lazily load components and catch rendering errors gracefully.