【Q076】Concurrent

[kangyana]

1. Concurrent 模式

concurrent 模式目前仅在 React 的 实验版本 可用。安装命令：

npm install react@experimental react-dom@experimental

开启 concurrent 模式

通常，当我们给 React 添加功能的时候，你可以立即使用。 比如 Fragments，Context，甚至 Hook。 你都可以直接在代码里使用他们，而不用修改之前的代码。

concurrent 模式并不是这样。 它给引入了新的语义，改变了 React 的工作方式。 否则不能启用 这些新功能。 这就是它被分组到了新的模式，而不是相继的发布出来。

你不能为某个子树单独启用 concurrent 模式。 你应该在 ReactDOM.render() 里启用它。

import ReactDOM from 'react-dom';

// 正常模式
// ReactDOM.render(<App />, document.getElementById('root'));

// concurrent 模式
ReactDOM.unstable_createRoot(document.getElementById('root')).render(<App />);

在 concurrent 模式下，生命周期 之前被标记过 为“不安全”是真的不安全，会比现在的 React 出现更多的 bug。 在你的 app 完全兼容 严格模式 之前，我们不建议使用 concurrent 模式。

[kangyana]

2. Concurrent 模式的新功能

Transition

useTransition API