写点什么

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

评论

发布
暂无评论

为什么i++不是原子操作?一个让无数并发程序崩溃的“常识”

poemyang

并发编程 多线程 原子性 Java并发编程

JavaScript面试题,为什么[] + 0 = '0', 而{} + 0 = 0?

不在线第一只蜗牛

JavaScript

智源研究院发布数据魔方,以智能化自定义方式重构模型训练数据供给范式

智源研究院

机器学习赋能计算机嗅觉革命:Osmo的气味图谱突破

qife122

机器学习 数字嗅觉

Hologres V3.1版本发布,Serverless型实例从零开始构建OLAP系统

阿里云大数据AI技术

人工智能 机器学习 大数据 数据分析 hologres

亚马逊机器人如何用多模态识别技术取代条形码

qife122

机器人技术 自动化识别

浅入了解向量数据库

老纪的技术唠嗑局

向量数据库

拯救重复劳动:无代码实现 Markdown文本抽取与切分

数由科技

markdown LLM 人工智能、 rag 文本分块

亚马逊AI模型评估产品评论中的实用建议有效性

qife122

自然语言处理 事实核查

国际标准组织共聚,智源推动全球AI开源与国际标准双轮驱动人工智能普惠化发展

智源研究院

Maven中的这些坑,99%的人不知道!

不在线第一只蜗牛

Java 开发

使用 Databend Cloud 归档 OceanBase 数据数据库

Databend

通义灵码保姆级教程:从数据读取、清洗、结合大模型分析、可视化、生成报告全链路

阿里云云效

阿里云 云原生 通义灵码

舆情监测和舆情管理的区别与协同价值

沃观Wovision

舆情监测 海外舆情监控 沃观Wovision 舆情监测系统

接口设计的原则:构建优雅API的完整指南

量贩潮汐·WholesaleTide

接口 API

千万级的大表如何新增字段?

电子尖叫食人鱼

大数据

Java中什么是类加载?类加载的过程?

量贩潮汐·WholesaleTide

Java

Kafka 不难,只是你用得不对

巴辉特

kafka

智慧工地实践案例:用数智应用破解土石方工程效率与成本难题

袋鼠云数栈

AI 数字化转型 云计算, 数字化解决方案 大数据计算

ElasticSearch 质量保障体系介绍

杭州群核科技质量效能

测试 ES 质量保障

舆情监测和舆情管理的区别与协同价值

沃观Wovision

海外舆情监控 舆情监测系统

烟草行政处罚案卷制作平台入选“AI Solutions for SME”全球案例

中烟创新

2025 杭州测试沙龙 Topic 火热征集中

杭州群核科技质量效能

测试 质量保障 AI+ 论坛

社区版 2025.7 | CQ-Mate V1.3发布啦!

BinTools图尔兹

数据库管理工具 数据库审计 社区版 流量分析系统 免费软件下载

基于 Nacos + Higress 的 MCP 开发新范式,手把手教程来了!

阿里巴巴云原生

阿里云 云原生 Higress

【跨国数仓迁移最佳实践3】资源消耗减少50%!解析跨国数仓迁移至MaxCompute背后的性能优化技术

阿里云大数据AI技术

人工智能 云计算 大数据 数据分析 数据迁移

火山引擎 MCP 安全架构与实践

Lily

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