TanStack libraries: when to use them in this prototype

Rule: add a library when a page needs it, not because it exists. Route loaders and server functions cover most prototype data needs.

In use

LibraryWhy
StartSSR, server functions (createServerFn) for the mock backend, explicit server/client boundary.
RouterType-safe routes and URL params, validated search params (e.g. search filters), route loaders for data.
Devtools (router panel)Inspect routes, params and loader data while building. Dev only.
IntentAgent skills for the installed TanStack packages. Dev tooling, not runtime.
CLIScaffolded the project. Can add add-ons later.

Not installed: add when a trigger appears

LibraryWhat it doesAdd it when
QueryClient-side async cache: dedupe, background refetch, mutations with cache invalidation, polling.Data must update without navigation, e.g. polling an order status, or many independent widgets sharing server data. Until then, use loaders plus router.invalidate() after a mutation.
FormType-safe form state, field-level and async validation, field arrays.An admin form gets complex: dependent fields, per-license price rows, cross-field validation. Simple forms can use plain <form> + a server function.
TableHeadless sorting, filtering, pagination, column visibility.An admin list needs sorting or filtering. Static lists can be plain shadcn <Table>.
StoreSmall framework-agnostic reactive store with selectors.Client state is shared across distant components and outlives a route: cart, "view as customer", theme. A cookie plus loader may still be simpler.
DBReactive client collections with live queries and optimistic mutations.We want admin edits to show instantly in the public side without server round-trips, or an offline-capable mock backend in the browser. Overkill while the mock backend lives in server memory.
VirtualRenders only visible rows/cells of long lists.Search shows thousands of results in one scroll. Not needed for a few hundred fixtures with pagination.
PacerDebounce, throttle, rate limit, queue.Search-as-you-type or live price recalculation fires too often.
HotkeysKeyboard shortcut handling.Facilitator shortcuts during user tests (switch variant, reset state, toggle theme).

Prototype data approach

  • Mock backend lives in server memory, seeded from data/.
  • Pages read via route loaders that call server functions.
  • Mutations call a server function, then router.invalidate() to reload loaders.
  • Admin and public share the same server state, so an admin change shows on the public side after navigation.