写点什么

TanStack DB 发布 Beta 版本,支持反应式查询、乐观变更和本地优先同步

作者:Daniel Curtis

  • 2025-09-02
    北京
  • 本文字数:1136 字

    阅读完需:约 4 分钟

大小:493.22K时长:02:48
TanStack DB发布Beta版本,支持反应式查询、乐观变更和本地优先同步

TanStack Query 背后的团队 TanStack 宣布 TanStack DB 发布 beta 版本,这是一个嵌入式的客户端数据库,旨在为前端应用程序带来反应式查询、事务性变更和实时同步。该库建立在 TanStack Query 之上,目的是简化现代 Web 应用程序中的复杂状态管理和缓存。


TanStack DB 引入了几种新功能,包括类型化集合、实时查询和事务性变更器(mutator)。集合会作为记录的规范化存储,而实时查询允许开发者订阅结果,这些结果会随着底层数据的变化而增量更新。与传统的重新运行查询不同,TanStack DB 使用差分(differential)数据流引擎仅重新计算受变更影响的部分查询,即使对于复杂的连接,也能实现亚毫秒级的查询更新。


其中一个主要特性是支持乐观变更。开发者可以在本地应用更改,并立即在 UI 中反映它们,而 TanStack DB 则在后台处理同步和回滚。这种方法基于 TanStack Query 中的模式,但目的是使它们更可靠。


集合、实时查询和变更可以使用与现有 TanStack Query 用户类似的格式,文档中包含了示例:

const todoCollection = createCollection({
// ...config
onUpdate: updateMutationFn,
})

const { data: todos } = useLiveQuery((q) =>
q.from({ todo: todoCollection }).where(({ todo }) => todo.completed)
)
const complete = (todo) => {
todoCollection.update(todo.id, (draft) => {
draft.completed = true
})
}
复制代码


TanStack DB 还强调了独立于后端实现的同步方式。数据可以从 REST、GraphQL、轮询 API 或实时同步提供者(如 ElectricSQL)加载或同步。这使得可以预加载大型数据集并保持同步,而无需引入自定义状态管理层或手动协调的逻辑。


来自开发者社区的早期反馈既表现出兴奋也表现出谨慎。在 r/reactjs 上,一位开发者这样评论道:这看起来很有前景,但仍然显得粗糙。我不会把我的应用押宝在 Beta 版本上。


在 Hacker News 上,鉴于当前的既有实现使用起来很困难,有人对该特性表示很兴奋:我感到非常兴奋。当前的客户端数据库实现很难使用。它会支持 IndexedDB 吗?


在 Medium 上,Shaya 详细论述了 TanStack DB 是如何解决前端框架中乐观更新方面长期存在的问题的:能够仅使用 TanStack Query 进行乐观更新吗?坦白说,它们有点糟糕……TanStack DB 通过集合、实时查询和乐观变更扩展了 TanStack Query,以保持 UI 的反应性、一致性和极速性。


TanStack DB 仍处于 beta 阶段,维护者提醒说,目前应将其视为实验性的。然而,它的逐步采用模型允许开发者将其逐渐集成到现有的 TanStack Query 应用程序中,而且它已经为 React、Vue、Solid、Svelte 或 VanillaJS 提供了适配器。


TanStack DB 是开源的,可以在 npm 上找到。官方站点提供了文档、示例和指南。


原文链接:

TanStack DB Enters Beta with Reactive Queries, Optimistic Mutations, and Local-First Sync

2025-09-02 13:004220

评论

发布
暂无评论

云原生时代数据库运维体系演进

vivo互联网技术

数据库 运维 故障自愈

【其他】快出数量级的性能是怎样炼成的

No8g攻城狮

MySQL sql 数据库·

真希望你也明白runtime.Map和sync.Map

面向加薪学习

面试 并发 源码阅读 go语言 Map集合

ArgoDB 5.1 正式发布:多模融合、实时分析和数据安全多重升级

星环科技

FL Studio2024永久免费版音乐程序

茶色酒

FL Studio FL Studio2023 FL Studio21

react源码分析:babel如何解析jsx

flyzz177

React

前端工程师leetcode算法面试必备-简单的二叉树

js2030code

JavaScript LeetCode

你可能需要的6个React开发小技巧

千锋IT教育

星环科技TDS 2.4.0 发布: 数据开发、数据治理、数据运营套件能力再次升级

星环科技

为什么 OpenCV 计算的视频 FPS 是错的

百度Geek说

OpenCV ffmpeg 12 月 PK 榜 帧率

MatrixOne 0.6.0 :首个云原生架构的HTAP数据库发布!

MatrixOrigin

分布式数据库 云原生数据库 国产数据库 MatrixOrigin MatrixOne

10个Python脚本来自动化你的日常任务

@下一站

Python 脚本 12月日更 12月月更

react源码中的生命周期和事件系统

flyzz177

React

用javascript分类刷leetcode3.动态规划(图文视频讲解)

js2030code

JavaScript LeetCode

开源依赖项管理指南

SEAL安全

12 月 PK 榜 依赖管理 传递依赖 开源依赖项

GaussDB(DWS)运维 :遇到truncate执行慢,怎么办

华为云开发者联盟

数据库 后端 华为云 12 月 PK 榜

JavaScript刷LeetCode心得

js2030code

JavaScript LeetCode

react源码分析:实现react时间分片

flyzz177

React

Mybatis源码解析之执行SQL语句

京东科技开发者

缓存 mybatis sql 源码学习 数据库·

四步骤打造银行智能标签体系,助力银行精准营销

袋鼠云数栈

智能标签 数据画像

从React源码来学hooks是不是更香呢

flyzz177

React

想做长期的 AB 实验?快来看看这些坑你踩了没

京东科技开发者

测试 测试原则 复盘归因 A/B 测试

跳板攻击中如何追踪定位攻击者主机(上)

郑州埃文科技

数据安全 网络攻击 跳板攻击

教你用JavaScript实现点击支付框

小院里的霍大侠

JavaScript 小白 编程开发 实战案例 初学者

Java开发如何通过IoT边缘ModuleSDK进行协议转换

华为云开发者联盟

Java 开发 华为云 12 月 PK 榜

从React源码角度看useCallback,useMemo,useContext

flyzz177

React

使用Spring Data Redis 发布订阅消息

码语者

redis Spring Boot message

BEVFormer-accelerate:基于EasyCV加速BEVFormer

阿里云大数据AI技术

深度学习 算法 计算机视觉 12 月 PK 榜

超1800万累计观看,多次占据热榜前列……“无障碍字幕直播间”带来的远不止这些!

猿始人

聚焦技术创新!旺链科技荣获“宝山区企业技术中心”认定

旺链科技

区块链 产业区块链 技术创新 12 月 PK 榜

云智慧蝉联中国IT统一运维ITSM软件市场第一!

云智慧AIOps社区

ITSM IT运维 运维管理

TanStack DB发布Beta版本,支持反应式查询、乐观变更和本地优先同步_数据库_InfoQ精选文章