TanStack FrontendType-safe routing, data, and tables for any framework
TanStack's suite of headless, framework-agnostic libraries — Router, Start, Query, Table, and Form — gives us fully type-safe, production-proven primitives we use across React, Vue, and Solid projects.
TanStack is a collection of headless, framework-agnostic libraries for routing, data fetching, tables, forms, and virtual scrolling — all with first-class TypeScript support. TanStack Query (formerly React Query) revolutionized async state management with its caching, background refetching, and optimistic update patterns. TanStack Router brings 100% type-safe routing to React with typed search params, loaders, and code splitting. TanStack Table powers complex data grids without imposing any UI. Together, they form a cohesive, production-tested toolkit we use across React, Vue, and Solid projects.
Quick start
npm install @tanstack/react-query @tanstack/react-query-devtoolsRead the full documentation at tanstack.com
TanStack Router
100% type-safe routing with search params, loaders, and nested layouts — no route string guessing.
TanStack Start
Full-stack React framework built on TanStack Router with server functions and SSR.
TanStack Query
Async state management with caching, background refetch, optimistic updates, and infinite scroll.
TanStack Table
Headless table logic — sorting, filtering, pagination, virtualisation — fully controlled.
TanStack Form
Type-safe form state with first-class validation, async submission, and zero dependencies.
Framework agnostic
Every TanStack library works with React, Vue, Solid, Angular, and Svelte via adapters.
Why it's hard
Learning the full TanStack ecosystem
Each TanStack library (Query, Router, Table, Form, Virtual) has its own concepts and APIs. Understanding how they compose together — especially Router + Query + Start — takes time.
Query cache invalidation strategies
TanStack Query's cache is powerful but requires careful thought about invalidation, stale times, and optimistic updates to avoid stale data bugs in production.
Type-safe search params complexity
TanStack Router's fully typed search params are powerful but add complexity — defining, validating, and serializing complex search state requires Zod schemas and careful API design.
Headless table implementation effort
TanStack Table is headless by design, meaning you build all the UI yourself. While flexible, implementing sorting, filtering, pagination, and virtualization UIs from scratch is significant work.
Best practices
Define query keys as factories
Create query key factories (e.g., userKeys.detail(id)) for consistent cache management. This prevents cache key collisions and makes invalidation predictable.
Set staleTime based on data freshness requirements
Don't use the default staleTime of 0 for everything. User profiles might be stale after 5 minutes; real-time data after 10 seconds. Tune per query.
Use TanStack Router's search param validation
Define Zod schemas for search params at the route level. This gives you type-safe URL state, automatic validation, and serialization — no more manual parsing.
Combine Query + Router for data loading
Use TanStack Router's loader functions with TanStack Query's ensureQueryData for cached, type-safe data fetching that works with SSR and prefetching.
Frequently asked questions
Related technologies
Related services
Looking for end-to-end delivery? These services complement TanStack projects.
Web Design
Websites that load fast, look sharp, and convert visitors into customers
Web App Development
Full-stack web applications built for real users and real scale
SaaS Development
Subscription software built to scale from day one
Performance Optimization
Find the bottlenecks and fix them — in code, queries, and infrastructure
Want to build with TanStack?
Talk to our engineering team about your TanStack architecture. We'll respond within 24 hours.
We limit intake each month so every project gets the focus it deserves.