{"id":28610912,"url":"https://github.com/TanStack/db","last_synced_at":"2025-06-11T23:02:47.476Z","repository":{"id":282925073,"uuid":"946895816","full_name":"TanStack/db","owner":"TanStack","description":"A reactive client store for building super fast apps on sync","archived":false,"fork":false,"pushed_at":"2025-06-11T15:18:02.000Z","size":981,"stargazers_count":2483,"open_issues_count":51,"forks_count":37,"subscribers_count":12,"default_branch":"main","last_synced_at":"2025-06-11T15:32:27.137Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://tanstack.com/db","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/TanStack.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-03-11T21:01:29.000Z","updated_at":"2025-06-11T15:24:16.000Z","dependencies_parsed_at":"2025-06-03T22:18:11.170Z","dependency_job_id":null,"html_url":"https://github.com/TanStack/db","commit_stats":null,"previous_names":["tanstack/optimistic","tanstack/db"],"tags_count":21,"template":false,"template_full_name":null,"purl":"pkg:github/TanStack/db","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TanStack%2Fdb","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TanStack%2Fdb/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TanStack%2Fdb/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TanStack%2Fdb/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TanStack","download_url":"https://codeload.github.com/TanStack/db/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TanStack%2Fdb/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259360728,"owners_count":22845817,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-06-11T23:01:57.999Z","updated_at":"2025-06-11T23:02:47.471Z","avatar_url":"https://github.com/TanStack.png","language":"TypeScript","readme":"# TanStack DB\n\n\u003c!-- ![TanStack DB Header](https://github.com/tanstack/db/raw/main/media/repo-header.png) --\u003e\n\n**A reactive client store for building super fast apps on sync**\n\nTanStack DB extends TanStack Query with collections, live queries and optimistic mutations that keep your UI reactive, consistent and blazing fast 🔥\n\n\u003cp\u003e\n  \u003ca href=\"https://x.com/intent/post?text=TanStack%20DB\u0026url=https://tanstack.com/db\"\u003e\n    \u003cimg alt=\"#TanStack\" src=\"https://img.shields.io/twitter/url?color=%2308a0e9\u0026label=%23TanStack\u0026style=social\u0026url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack\" /\u003e\u003c/a\u003e\n  \u003ca href=\"#status\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/status-alpha-orange\" alt=\"Status - Alpha\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://npmjs.com/package/@tanstack/db\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/npm/dm/@tanstack/db.svg\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://discord.gg/yjUNbvbraC\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/badge/Discord-TanStack-%235865F2\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/tanstack/db/discussions\"\u003e\n    \u003cimg alt=\"Join the discussion on Github\" src=\"https://img.shields.io/badge/Discussions-Chat%20now!-green\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://x.com/tan_stack\"\u003e\n    \u003cimg alt=\"\" src=\"https://img.shields.io/twitter/follow/tan_stack.svg?style=social\u0026label=Follow @TanStack\" /\u003e\u003c/a\u003e\n\u003c/p\u003e\n\nEnjoy this library? Try the entire [TanStack](https://tanstack.com), including [TanStack Query](https://tanstack.com/query), [TanStack Store](https://tanstack.com/store), etc.\n\n## 🚀 Why TanStack DB?\n\nTanStack DB gives you robust support for real-time sync, live queries and local writes. With no stale data, super fast re-rendering and sub-millisecond cross-collection queries — even for large complex apps.\n\nBuilt on a TypeScript implementation of differential dataflow ([#](https://github.com/electric-sql/d2ts)), TanStack DB gives you:\n\n- 🔥 **a blazing fast query engine**\u003cbr /\u003e\n  for sub-millisecond live queries \u0026mdash; even for complex queries with joins and aggregates\n- 🎯 **fine-grained reactivity**\u003cbr /\u003e\n  to minimize component re-rendering\n- 💪 **robust transaction primitives**\u003cbr /\u003e\n  for easy optimistic mutations with sync and lifecycle support\n- 🌟 **normalized data**\u003cbr /\u003e\n  to keep your backend simple\n\nTanStack DB is **backend agnostic** and **incrementally adoptable**:\n\n- plug in any backend: sync engines, REST APIs, GraphQL, polling, custom sources\n- builds on [TanStack Store](https://tanstack.com/store), works with and alongside [TanStack Query](https://tanstack.com/query)\n\n## 💥 Usage example\n\nSync data into collections:\n\n```ts\nimport { createQueryCollection } from \"@tanstack/db-collections\"\n\nconst todoCollection = createQueryCollection\u003cTodo\u003e({\n  queryKey: [\"todos\"],\n  queryFn: async () =\u003e fetch(\"/api/todos\"),\n  getId: (item) =\u003e item.id,\n  schema: todoSchema, // any standard schema\n})\n```\n\nUse live queries in your components:\n\n```tsx\nimport { useLiveQuery } from \"@tanstack/react-db\"\n\nconst Todos = () =\u003e {\n  const { data: todos } = useLiveQuery((query) =\u003e\n    query.from({ todoCollection }).where(\"@completed\", \"=\", false)\n  )\n\n  return \u003cList items={todos} /\u003e\n}\n```\n\nApply mutations with local optimistic state:\n\n```tsx\n// Define collection with persistence handlers\nconst todoCollection = createCollection({\n  id: \"todos\",\n  // ... other config\n  onInsert: async ({ transaction }) =\u003e {\n    const modified = transaction.mutations[0].modified\n    await api.todos.create(modified)\n  },\n})\n\n// Then use collection operators in your components\nconst AddTodo = () =\u003e {\n  return (\n    \u003cButton\n      onClick={() =\u003e\n        todoCollection.insert({\n          id: uuid(),\n          text: \"🔥 Make app faster\",\n          completed: false,\n        })\n      }\n    /\u003e\n  )\n}\n```\n\n## 📚 Docs\n\nSee the [Usage guide](./docs/overview.md) for more details, including how to do:\n\n- real-time sync\n- cross-collection queries\n- fine-grained reactivity\n- different strategies for data loading and handling mutations\n\nThere's also an example [React todo app](./examples/react/todo) and usage examples in the [package tests](./packages/db/tests).\n\n## 🧱 Core concepts\n\n### Collections\n\n- typed sets of objects that can mirror a backend table or be populated with a filtered view or result set, such as `pendingTodos` or `decemberNewTodos`\n- collections are just JavaScript data \u0026mdash; load them on demand and define as many as you need\n\n### Live queries\n\n- run reactively against and across collections with support for joins, filters and aggregates\n- powered by differential dataflow: query results update incrementally, not by re-running the whole query\n\n### Transactional mutators\n\n- batch and stage local changes across collections with immediate application of local optimistic updates\n- sync transactions to the backend with automatic rollbacks and management of optimistic state\n\n## 🔧 Install\n\n```bash\nnpm install @tanstack/react-db @tanstack/db-collections\n```\n\nOther framework integrations are in progress.\n\n## ❓ FAQ\n\n**How is this different from TanStack Query?**\u003cbr /\u003e\nTanStack DB builds _on top of_ TanStack Query. Use Query to fetch data; use DB to manage reactive local collections and mutations. They complement each other.\n\n**Do I need a sync engine like ElectricSQL?**\u003cbr /\u003e\nNo. TanStack DB _is_ designed to work with sync engines like [Electric](https://electric-sql.com) but _also_ works with any backend: polling APIs, GraphQL, REST, or custom sync logic.\n\n**What is a Collection? Is it like a DB table?**\u003cbr /\u003e\nKind of. Collections are typed sets of objects, but they can also be filtered views or custom groupings. They're just JavaScript structures that you define and manage.\n\n**Is this an ORM? Do queries hit my backend?**\u003cbr /\u003e\nNo. TanStack DB is not an ORM. Queries run entirely in the client against local collections. The framework provides strong primitives to manage how data is loaded and synced.\n\n## Partners\n\n\u003ca href=\"https://electric-sql.com\"\u003e\n  \u003cimg alt=\"ElectricSQL logo\"\n      src=\"https://raw.githubusercontent.com/electric-sql/meta/main/identity/ElectricSQL-logo.with-background.sm.png\"\n  /\u003e\n\u003c/a\u003e\n\n## Status\n\nTanstack DB is currently an early preview release in alpha. It's still under active development. There will be bugs and the APIs are still liable to change.\n\n## Contributing\n\nView the contributing guidelines [here](https://github.com/TanStack/query/blob/main/CONTRIBUTING.md).\n\n### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)\n\n\u003c!-- Use the force, Luke --\u003e\n","funding_links":["https://github.com/sponsors/tannerlinsley/"],"categories":["TypeScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTanStack%2Fdb","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FTanStack%2Fdb","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTanStack%2Fdb/lists"}