写点什么

Nuqs 添加了防抖、标准模式集成和键隔离

作者:Daniel Curtis

  • 2025-10-06
    北京
  • 本文字数:1239 字

    阅读完需:约 4 分钟

大小:598.68K时长:03:24
Nuqs添加了防抖、标准模式集成和键隔离

Nuqs是为 React 设计的类型安全的 URL 状态管理器,最近在它的最新版本中发布了一系列新功能,提供了一些人们期待已久的能力,比如防抖的URL更新标准化的模式互操作性更细粒度的重新渲染控制以及实验性的路由集成

 

一项突出的特性是 URL 更新的防抖支持。以前,Nuqs 依赖于throttleMs属性进行节流,以限制历史 API 调用的速率。在快速输入变化(如搜索输入)时,使用这种方式可能会导致过多的请求。现在有一个新属性叫做 limitUrlUpdates(它取代了现有的throttleMs选项),并且接受一个防抖函数(debounce):

 

const [search, setSearch] = useQueryState('search', {  defaultValue: '',  shallow: false,  limitUrlUpdates: debounce(250)});
复制代码

现有的throttleMs选项已被弃用,转而支持合并后的limitUrlUpdates策略,它允许同时进行节流和防抖模式。

 

从 v2.5 版本开始,可以生成标准模式。Nuqs 现在允许从搜索参数定义中派生出一个校验/解析模式,使得可以与tRPC或路由模式等工具进行集成。

 

键隔离(key isolation)通过细粒度订阅提供了性能改进。以前,URL 的任何变化都会导致所有使用useQueryState的组件重新渲染,这是因为共享的 URL 对象改变了引用。在 v2.5 中,Nuqs 现在能够避免这种情况,只有当特定的键发生变化时,组件才会重新渲染。这种行为被内置到了 React SPA、React Router、Remix 和 TanStack Router 的核心适配器中。值得注意的是,Next.js 是一个例外,因为它内部使用了单一的 URLSearchParams 上下文,这始终会改变引用。Nuqs 的维护者提到了与 Next.js 正在进行合作,以缓解这个问题。

 

Nuqs 2.5 还增加了实验性的TanStack Router支持。有一个兼容性适配器允许 Nuqs 管理的 URL 状态与 TanStack Router 的路由逻辑并存,而标准模式接口有助于将 URL 状态定义与路由验证联系起来。虽然特性对等方面依然有限,但这为 React 框架之间的 monorepos 或共享逻辑打开了大门。

 

这个版本还包括了许多改善开发人员生活质量的更新,比如导出的package.json支持模块联合,更多的全局默认适配器选项,以及更好的默认值类型推断。另外,值得注意的是,Nuqs 现在是一个“零运行时依赖”的库,尽管提供了新功能,它的大小仍然不到 5.5kb。

 

最近,在更小的 2.6 版本中,增加了几项增强功能。新的processUrlSearchParams钩子允许开发者拦截和转换 URLSearchParams。当使用shallow:true 与防抖时,现在也会显示一个新的警告消息

 

有的用户在讨论 2.5.0 版本的帖子上评论强调了新特性:

nuqs@2.5.0 太强大了,比如防抖、标准模式、键隔离、TanStack Router 支持。

 

Nuqs 是一个开源项目,专注于使 URL 查询参数成为 React 应用程序中的一等状态。它提供了一个useQueryState钩子,以反映了useState的语义,内置了类型安全性、序列化/解析和服务器/客户端协调。随着 2.5 版本的发布,Nuqs 加强了与模式工具的集成,为开发者提供了更多对更新行为的控制,并通过隔离减少了不必要的重新渲染,同时为更好的路由互操作性奠定了基础。

 

原文链接:

Nuqs Adds Debounce, Standard Schema Integration and Key Isolation

2025-10-06 20:518228

评论

发布
暂无评论

云南区块链布局

CECBC

区块链 大数据

一致性hash算法及标准差计算

知行合一

极客时间架构师培训 1 期 - 第 5 周总结

Kaven

架构师训练营第 5 周作业

netspecial

极客大学架构师训练营

第一周作业

CraspLion

Raft算法之日志篇

心平气和

raft

架构师训练营第 1 期 - 第五周总结

Todd-Lee

极客大学架构师训练营

架构 2 期 - 第一周作业(2)

浮生一梦

极客大学架构师训练营 第一周总结 2组

架構師訓練營 week5 總結

ilake

Raft 作者亲自出的 Raft 试题,你能做对几道?

多颗糖

分布式系统

不了解Raft算法敢说研究过分布式?

心平气和

分布式 raft

第1周作业:食堂就餐卡系统设计

Steven

【架构师训练营第 2 期】第1周作业

知致

食堂就餐卡系统设计

Alvin

极客大学架构师训练营 第一周命题作业 2组

第一周-学习总结

ray-arch

极客大学架构师训练营

Raft算法之选举篇

心平气和

raft 选举

架构师训练营第五周作业

四夕晖

分布式事务实现及比较

luojiahu

分布式事务

Raft算法之快照篇

心平气和

raft 快照

Architecture Phase1 Week5:Summarize

phylony-lu

极客大学架构师训练营

架构2期-第一周作业(1)

浮生一梦

极客大学架构师训练营 第一周命题作业 2组

第一周-作业

ray-arch

极客大学架构师训练营

week05

……

架构师训练营第 1 期第 五 周学习总结

郑凯元

极客大学架构师训练营

架构师训练营第 1 期第 五 周作业

郑凯元

极客大学架构师训练营

Java一致性Hash算法及测试标准差

A p7+

设计自己的核心竞争力链

boshi

职场 随笔杂谈

蹲坑的时候该读什么?

善宝橘

第1周 架构方法作业

心在那片海

架構師訓練營 week5 作業

ilake

学习笔记:架构师训练营-第五周

四夕晖

缓存 消息队列 负载均衡架构 session处理方案

Nuqs添加了防抖、标准模式集成和键隔离_大前端_InfoQ精选文章