TanStack
DB v0v0
Docs
CodeRabbit
Cloudflare
Railway
WorkOS
Clerk
AG Grid
SerpAPI
OpenRouter
Netlify
Unkey
Prisma
Electric
Sentry
CodeRabbit
Cloudflare
Railway
WorkOS
Clerk
AG Grid
SerpAPI
OpenRouter
Netlify
Unkey
Prisma
Electric
Sentry
Menu
Getting Started
Guides
Collections
Frameworks
Community
API Reference

Reactive client store

TanStackDB

beta

Query your API data like local reactive state.

DB turns synced API data into typed collections, then runs live queries over them so joins, filters, optimistic writes, and derived UI stay fast and consistent without hand-built client state.

Total DownloadsWeekly DownloadsGitHub Stars

The first brownfield, backend-agnostic sync engine for frontend apps.

Read the docs

Collections

typed sets of synced API data

Live queries

joins, filters, aggregates, reactivity

Local writes

optimistic transactions and rollback

Built in publicPartner-backedSponsor-supported
todo collection

collection

todosCollection

3 todos

live query

todosCollection

2 open

optimistic

todosCollection

0 pending
useLiveQuery(openTodos)live query: open todos
synced
Open todo
Owner
State
Ship invite flow
Tanner
synced
Review pricing copy
Noah
synced
Insert or complete a todo. The collection changes first, then the live query result updates immediately while the server catches up.

Why DB

Server state gets awkward when the UI needs a data graph.

Query is excellent for fetching and caching resources. DB adds the reactive relational layer that product apps eventually need: local collections, cross-collection queries, optimistic transactions, and incremental updates.

Collections make API data queryable.

Load, sync, or persist typed records into collections, then query the data your UI actually needs instead of spreading derived state through components.

Live queries update the result, not the whole app.

DB uses differential dataflow to recompute only the changed parts of joins, filters, and aggregates, so large local graphs still feel instant.

Local writes are first-class.

Optimistic mutations can stage transactions across collections, update the UI immediately, then commit or rollback with lifecycle support.

Sync strategy can evolve with the product.

Start with REST, GraphQL, tRPC, TanStack Query, Electric, PowerSync, Trailbase, or your own collection creator without changing how components query.

1

Collect

API records enter typed collections from sync engines, query functions, persistence, or custom loaders.

2

Query

The UI declares the live query shape: filters, joins, includes, aggregates, ordering, and limits.

3

Increment

When data changes, DB updates only the affected query results instead of recomputing the full graph.

4

Render

Framework adapters subscribe components to the result so the view stays current without manual cache wiring.

Differential dataflow

The view is a query over collections.

DB keeps normalized collections in memory, then updates live query results incrementally as records change. The UI describes the data shape; DB keeps it current.

Query-driven sync

Let the component query become the loading contract.

When sync mode is on demand, DB can pass query predicates, ordering, and limits to your loader. Map that shape to an API precisely, or start broad and let DB filter locally while your API catches up.

liveQuery({ projects, issues, members })
  .where(({ issue, project }) => issue.projectId === project.id)
  .orderBy(({ issue }) => issue.updatedAt, "desc")

predicate

where issue.projectId = route.params.id

subset

load only the records this live query can see

dedupe

shared requirements collapse into fewer network calls

fallback

fetch broad, filter client-side, optimize later

Framework adapters

A data model below your renderer.

Use the adapter that fits your app while keeping collections, live queries, transactions, and sync strategy in the same DB model.

ReactVueSolidSvelteVanilla

Product shape

Use DB when a cache starts wanting to be a database.

It is built for apps with real relationships, local writes, subset loading, sync engines, persistence, and UI-shaped derived data. Keep Query for request orchestration; bring in DB when the client needs a reactive data graph.

Open source ecosystem

DB is being shaped with teams building data-heavy products.

Maintainers, examples, sync integrations, partners, and GitHub sponsors keep the reactive data layer close to production app problems.

GitHub Sponsors

Become a Sponsor
Wow, you've come a long way!
Only one thing left to do...
© 2026 TanStack LLC