停止阻塞 UI:React 中的可中断渲染
React 的渲染可能会导致用户界面冻结。
繁重的计算会阻塞主线程。用户会看到一个冻结的屏幕。这会破坏用户体验。
可中断渲染解决了这个问题。它允许 React 暂停工作以处理用户输入。
工作原理:
- React 将工作拆分为细小的任务块。
- 它会检查点击或打字等高优先级任务。
- 如果用户进行交互,React 会暂停后台任务。
- React 会优先处理输入。
- 然后 React 再恢复后台任务。
你可以使用 transitions 来管理这一点。使用 useTransition 来标记非紧急更新。这会告诉 React 保持 UI 的响应性。
不要再让繁重的数据处理破坏你的应用性能了。
来源:https://dev.to/iprajapatiparesh/stop-blocking-the-ui-interruptible-rendering-in-react-32mb