硬核干货——《中小企业 AI 实战指南》免费下载! 了解详情
写点什么

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:515

评论

发布
暂无评论

从功能测试进阶自动化测试,熬夜7天整理出这一份3000字超全学习指南【附网盘资源】

伤心的辣条

Python 程序员 软件测试 IT 自动化测试

35人首次上榜、行者皆勇者——创业邦3040新青年创投峰会圆满落幕

创业邦

GPU渲染全解读:GPU渲染器的发展与对比

Finovy Cloud

渲染器 GPU服务器

国家先进计算产业创新(宜昌)中心正式落地 由中科曙光、升哲科技联合运营

SENSORO

人工智能 物联网 新基建 智慧城市

元气部落仿站开发,元气部落盲盒系统APP开发

WDL22119

盲盒小程序开发 盲盒源码 盲盒H5开发 盲盒APP系统开发 元气部落仿站开发

前端工程化:保姆级教学 Jenkins 部署前端项目

伤心的辣条

Python 程序员 jenkins 自动化测试 接口测试

Git 不要只会 pull 和 push,学学这 5 条提高效率的命令

CRMEB

CVPR2022 |小红书首创多图交互建模挑战热门研究课题,大幅提升行人重识别性能

小红书技术REDtech

Transformer CVPR2022 行人重识别

如何高效的进行接口测试?【工具篇】

Liam

测试 Postman 接口测试 API接口管理 接口测试工具

国际SaaS企业有哪些机遇和挑战

ToB行业头条

2022中国信通院安全运营发展论坛成功召开

中国IDC圈

安全

云上360行丨深耕快消品行业数字化转型,纷享销客与华为云合力同行

华为云开发者联盟

人工智能 modelarts 快消品 纷享销客

安势信息加入OpenSSF (开源安全基金会), 共建软件供应链安全

安势信息

Linux DevOps SCA工具 opensource

InnoDB体系架构

龙空白白

MySQL InnoDB

UI自动化测试框架搭建-优化企业微信通知

伤心的辣条

Python 程序员 软件测试 自动化测试 UI自动化

直播回顾 | 传统应用进行容器化改造,如何既快又稳?

BoCloud博云

云原生 容器云 应用

3 个技巧来破解你可以立即使用的 Flutter 生产力!

坚果

6月月更

CloudTTY:下一代云原生开源 Cloud Shell

Daocloud 道客

Kubernetes 云原生 开源项目 网页命令行

LeaRun.Java表单快速开发工具

力软低代码开发平台

给你一个项目,你将如何开展性能测试工作?

伤心的辣条

Python 程序员 IT 自动化测试 接口测试

转行软件测试跳槽到新公司,工作如何快速上手?

伤心的辣条

Python 程序员 软件测试 自动化测试 接口测试

测试员该知道的软件测试流程,你都知道吗?

伤心的辣条

Python 程序员 软件测试 IT 自动化测试

俄航天局局长:外星生命或正在研究人类文明

Dylan

俄罗斯 外星人 航天局

博云《应用上容器指南》首发!详解应用容器化改造

BoCloud博云

容器 云原生 容器云 应用

养老金融政策频出,市场有多大?

易观分析

养老消费

数据关联最佳实践

观测云

可观测性 可观测

应用实践 | Apache Doris 在网易互娱的应用实践

SelectDB

MySQL 数据库 最佳实践 apache doris 数据优化

新一代政务云的“前移”与“致远”

云计算

Vue-8-计算属性和侦听属性

Python研究所

6月月更

打造软件供应链安全平台,「安势信息」完成数千万元天使轮融资

安势信息

OSPO如何帮助保护你的软件供应链

安势信息

开源 DevOps 开源社区 SCA opensource

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