https://zh-hans.react.dev/reference/react/useDeferredValue

useDeferredValue 拥有“延迟显示”能力：当传入state的新值发生变化但还未准备好时，它先返回旧值完成本次渲染，再在后台低优先级地渲染新值；只要后台渲染完成，新值就会自动提交到屏幕。具体来说，当 useDeferredValue 接收到与之前不同的值时，除了当前渲染使用旧值，它还会安排一个后台重新渲染。这个后台重新渲染是可以被中断的，如果 state 有新的更新，React 会从头开始重新启动后台渲染。举个例子，如果用户在输入框中的输入速度比接收延迟值重新渲染的速度快，那么界面只会在用户停止输入后重新渲染。

useDeferredValue 与 <Suspense> 集成。如果由于新值引起的后台更新导致 UI 暂停，用户将不会看到后备方案。他们将看到旧的延迟值，直到数据加载完成。

使用场景

1. 在新内容加载期间显示旧内容。
2. 表明内容已过时。我们只需要比较 stateValue 和 DeferredValue之间是否相等，不相等做过时逻辑。
3. 延迟渲染 UI 的某些部分（快慢组件）。如果有一个非常耗费计算时间的List会在用户输入input时重新触发计算，目前主流的做法是将这个input的受控state做节流或防抖。如果使用useDeferredValue 能够优先更新输入框（必须快速更新），而不是更新结果列表（可以更新慢一些），从而缓解这个问题：这并没有让 List 的重新渲染变快。然而，它告诉 React 可以将列表的重新渲染优先级降低，这样就不会阻塞按键输入。列表的更新会“滞后”于输入，然后“追赶”上来。与之前一样，React 会尽快更新列表，但不会阻塞用户输入。