TanStack: From Scattered Libraries to a Complete Full-Stack Ecosystem

by JeariCk 8 min read
tanstack: The open-source application stack for the web

If you’ve been writing React in the last couple of years, you’ve probably used something from the TanStack project — maybe React Query (now just Query under the same umbrella), maybe `@tanstack/react-table`. But if you still think of it as “a collection of nice but disconnected libraries,” you’ve missed the bigger picture.

Over the past two years, TanStack has quietly transformed from a set of solid-but-independent frontend libraries into a full-stack toolchain covering data fetching, routing, forms, tables, virtual scrolling, databases, AI, hotkeys, and performance control. As of May 2026, this is no longer just “a better alternative to Redux” — it’s directly challenging Next.js’s dominance, taking a very different path to get there.

tanstack: The open-source application stack for the web
tanstack: The open-source application stack for the web

Where It Started: React Table to React Query

Founder Tanner Linsley started with React Table. Back then, frontend table components were either bloated and expensive (like AG Grid) or way too limited. His solution was a fully headless approach — the library handles the logic, you handle the UI, and your table can look exactly how you want. This philosophy became the DNA of every library in the project.

React Query, launched in 2019, was the real turning point for TanStack. Its core insight is simple: server data and client state are fundamentally different things that shouldn’t be mixed. You define a key, write a fetch function, and Query handles caching, background refetching, error recovery, and optimistic updates automatically. Before that, you had to write loading/error boilerplate in useEffect for every single component.

How popular did it get? Redux Toolkit later added RTK Query. React Router v6’s loader mechanism was clearly influenced by it. React Query basically redefined how frontend apps talk to APIs.

The rebranding to TanStack in 2021, dropping the React-only name and embracing a multi-framework approach (Vue, Solid, Svelte, Angular, Lit all got adapters), signaled that Tanner wasn’t content being just a React plugin author.

Filling in the Gaps, One Library at a Time

From 2022 to 2025, TanStack’s puzzle pieces came together at a steady cadence. Every step solved a real pain point:

Router (2023): The first truly type-safe router in the React ecosystem. URL params and search params are auto-inferred from code. Routes form a parent-child tree, and the design is considerably more rigorous than React Router. One library serves both React and Solid.

Form (2024): Headless forms with maxed-out type safety. Async validation (checking if a username is taken, for example) is a first-class citizen — debounce, loading states, and cancellation are built in. More type-driven than React Hook Form.

Table (2024 rewrite): Formerly react-table, rewritten with broader framework support. Pagination, sorting, filtering, grouping, and column pinning are all headless.

Virtual (2024): Virtual scrolling, formerly react-virtual. Essential for large lists, keeps you at 60fps.

Pacer (2025): Debounce, throttle, rate limit, queue, and batch — performance control utilities. You could use lodash, but Pacer is more type-safe and covers every common scenario.

DB (2025, Beta): This one is a game-changer. It’s no longer just “cache for API data” — it’s a client-first reactive database with live queries, optimistic mutations, and collection-level change tracking. If you’ve built an app that needs local real-time data sync (collaborative editor, stock dashboard), you know exactly what problem this solves.

AI (2025/2026, Alpha): An open-source AI SDK with a unified interface across multiple providers — OpenAI, Anthropic, Gemini, Ollama. The key difference from Vercel AI SDK: it’s framework-agnostic, pure open-source, with zero platform lock-in. Type-safe tool calling, streaming responses, and thinking model support are all standard.

HotKeys (2026, Alpha): A type-safe hotkey library supporting sequences, combos, and key recording. Great for editors or SaaS tools.

CLI + MCP Server (2026): CLI scaffolding and an MCP protocol server that lets AI agents interact directly with the project. Smart move — Tanner is building infrastructure for the “AI writes code” era instead of chasing wrapper trends.

Config (2025): A build toolchain covering lint, build, test, version, and publish. If you want to publish an npm package without configuring tooling from scratch, this is your kit.

Intent (2026, Alpha): Agent Skills — your npm package can come with a “skill manual for AI agents” that AI can discover and consume automatically. This is Tanner’s answer to “AI-native development.”

Start: The True Full-Stack Anchor

All those libraries, as impressive as they are, still add up to a frontend ecosystem. What actually pushed TanStack from “library collection” to “complete ecosystem” is the Start framework.

From late 2025 into 2026, Start graduated from Beta to RC/stable. Its positioning is crystal clear: a client-first full-stack framework, not a server-first one.

This is the opposite of Next.js’s philosophy, and it reflects TanStack’s core belief that developers shouldn’t have to choose between SPA simplicity and server-side capabilities.

DimensionNext.jsTanStack Start
Core architecture Server-first (SSR/SSG/ISR on by default) Client-first (SPA by default, SSR opt-in)
Routing File-system, tied to App Router File + code routing, built on TanStack Router
Type safety TypeScript-compatible TypeScript-native, full-chain type inference
Data fetching Server Components / Server Actions Isomorphic loaders + built-in TanStack Query
Build tooling Turbopack Vite + Nitro
Server functions Server Actions (RSC model) Server Functions (explicit RPC)
Platform lock-in Best on Vercel Multi-platform (Nitro adapters)
SSR mode Full-document SSR + RSC Full-document SSR + Streaming

In plain English: Next.js assumes you want a server-rendered website and layers client interactivity on top. Start assumes you want a client-side SPA and layers SSR on top when your SEO requirements call for it.

Which one is right? Depends on the project. For content sites (blogs, e-commerce, marketing pages), Next.js saves you setup time. For data-heavy apps (dashboards, internal tools, SaaS backends), Start’s SPA-first design will save you from a lot of headaches. And Start’s SSR is opt-in — you turn it on when you need it, not off when you don’t.

The 2026 Ecosystem Overview

As of mid-2026, the full stack looks like this:

“`
📊 Data Layer: Query (API cache/sync)
DB (client-side reactive database)
Store (cross-framework reactive store)

🗺️ Routing Layer: Router (type-safe routing)
Start (full-stack = Router + SSR + Server Fn)

🎨 UI Layer: Table (headless table/datagrid)
Form (type-safe forms + validation)
Virtual (virtual scrolling)
HotKeys (keyboard shortcuts)

⚡ Performance: Pacer (debounce/throttle/rate-limit/batch)

🤖 AI Layer: AI (multi-provider AI SDK)

🛠️ Tooling: Config (package toolchain)
CLI (scaffolding/MCP)
Intent (Agent Skills)
DevTools (unified debug panel)
“`

TanStack’s core philosophy boils down to one sentence: each library solves one specific problem, decoupled but naturally complementary. You can use just Query, combine Router + Query + Form, or go all-in with TanStack Start.

next.js - a React application development framework
next.js – a React application development framework

How It Stacks Up Against Other Options

Start vs Next.js

TanStack Start’s differentiator is flexibility and type safety.

✅ Good fits for Start: SaaS backends, data dashboards, internal tools, SPAs with complex client-side interactions

❌ Better alternatives exist for: content-heavy websites, pages with strict SEO requirements, large static sites needing ISR

Query vs the original React Query

Same thing — just renamed after the rebranding. The key difference is multi-framework support. If your team might switch frameworks down the road, Query is the safer bet.

TanStack vs T3 Stack

T3 Stack (tRPC + Next.js + Prisma + Tailwind) also runs on type safety, driven by tRPC’s end-to-end typed API calls. TanStack leans toward frontend self-sufficiency without tying you to a specific backend. The two can coexist (tRPC + Query), but TanStack Start nudges you toward server functions over tRPC.

What This Ecosystem Actually Means

From an engineering perspective, TanStack and Next.js do fundamentally different things: Next.js gives you conventions and handles everything if you follow them; TanStack gives you building blocks and lets you assemble them your way.

That’s the TanStack philosophy — a steeper learning curve but way more freedom in exchange. You don’t need to adopt RSC just for SEO. You don’t have to let Turbopack shape your build decisions. You don’t need to sacrifice client-side control for server actions.

If you’re an indie developer or a small team, TanStack Start + Query + Form gives you a type-safe full-stack app that’s just as polished as Next.js — and if you later switch platforms (from Vercel to Cloudflare, for example), you swap an adapter, not your entire architecture.

Where Should You Start

Depends on where you are right now:

1. Already using Query: Check out Router. The Route + Query integration is a huge quality-of-life improvement.
2. Using Next.js but struggling with RSC complexity: Evaluate Start. The client-first approach will likely click for you.
3. Starting a new project from scratch: Go with Start + Query + Form + Virtual. This combo covers about 90% of daily development needs.
4. Shipping an npm package: Look at Config and Intent. They streamline publishing and AI integration.

Final Thoughts

By 2026, the frontend framework conversation has shifted from “which one performs better” to “which one lets you move faster without compromise.” TanStack’s evolution proves something: an open-source ecosystem without a big corporation behind it can still challenge the established players, as long as every library genuinely solves a real problem.

As Tanner Linsley put it in a recent podcast: “We don’t ask you to compromise — not by sacrificing type safety for speed, and not by piling on boilerplate for type safety.” That’s probably the best summary of what the TanStack ecosystem is all about.

📖 Recommended Reading

After reading the engineering-related content, you may also be interested in these articles related to front-end engineers and AI:

React 19 vs Vue 3.6: Two Radically Different Frontend Philosophies

AI-First Full-Stack Development: The New Rules

WebAssembly + Rust 2026: A High-Performance Engine for Full-Stack Frontend Development



Leave a Reply

Your email address will not be published. Required fields are marked *