Post

🚀 TanStack DB 0.5 is here with Query-Driven Sync Your component's query IS the API call. No custom endpoints. No GraphQL resolvers. Just write your query and DB figures out exactly what to fetch. Details 🧵👇

React made components pure functions: UI = f(state) TanStack DB brings the same philosophy to data: view = query(collections) You describe what data you need. DB handles fetching, caching, and updating—even across massive datasets.

This query: useLiveQuery(q => q.from({ todos }) .where(eq(status, 'active')) ) Automatically becomes: GET /api/todos?status=active No backend changes needed. Your queries become the API.

0.5 adds 3 sync modes for different use cases: - Eager: Load everything upfront (<10k rows) - On-demand: Load only what queries need (>50k rows, search) - Progressive: Load subset now, sync full dataset in background (collaborative apps)

Multiple components, same query? ONE network request. Complex joins? Minimal batched requests. Already-loaded rows? Reused automatically. Fewer total requests than custom APIs, with better cache utilization.

First query: ~100ms with targeted network request Meanwhile: Full dataset syncs in background After sync: ALL queries run in <1ms client-side Fast first paint + instant everything else.

Designed for your existing REST, GraphQL, or tRPC APIs. No backend migration. Bonus: Works with sync engines (@electric-sql.com, Trailbase, PowerSync) for real-time updates with near-zero incremental network cost.