Project
Credits
raf-effect-atom builds on Effect Atom and Effect RPC, takes its boundaries from result-rpc and its loaders from raf-query, and its demos' visuals are inspired by Visual Effect and the Effect website.
Effect
Both packages are thin layers on Effect: Effect Atom's registry is the cache, AtomRpc makes the query atoms, and Effect RPC's Schemas carry typed failures from the server to the browser. Thanks to the Effect team.
result-rpc
The typed error boundaries are result-rpc's idea: its Shells are error boundaries that claim failure classes and remove them from the component's error type. effect-atom-boundary is that idea over Effect Atom, claiming by _tag.
raf-query
The loader verbs, prefetch, ensure and fetch, and the way results stream from loaders into the browser, come from raf-query, a render-as-you-fetch cache for React. So do this site, its live demos and its docs tooling.
The demos' visuals
The live demos draw what happens over time, after two sources of inspiration:
- Kit Langton's Visual Effect (source), which shows Effect programs as nodes that change colour as they run, succeed, fail or die, with a timer while they run. The demos' atoms do the same through
Initial,SuccessandFailure. - The Effect website's visuals, such as the lane timelines in its Module of the Week posts (Cluster, part 4), where messages travel between lanes over time. The demos' requests travel between the registry and the worker's RPC server the same way.
The demos' code is this site's own, built on its shared components.
TanStack
The router integration and this site run on TanStack Router and TanStack Start.