ReactJS - 严格模式

React 基于组件、属性和状态的概念构建。React 提供了相对较少的 API 来创建和更新组件。React 的基本特性足以满足我们大部分前端应用的需求。但是，现代应用仍然存在复杂的场景，需要高级前端逻辑。React 提供了许多高级 API，可以帮助我们创建复杂的前端应用。高级 API 有一定的成本。高级 API 比较难学习并在我们的应用中应用。

React 提供了一种严格模式，它通过在应用的开发阶段突出潜在问题来帮助开发者正确应用高级 API。众所周知，React 中的一切都是基于组件的概念构建的，严格模式只是一个非可视组件，`React.StrictMode`。严格模式组件的使用也很简单。只需将要分析的组件用 `React.StrictMode` 组件包装起来，如下所示：

<React.StrictMode>
   <OurComplexComponent />
</React.StrictMode>

严格模式的另一个功能是在应用中使用某些遗留或已弃用的 API（最终会在应用中引入 bug）时抛出错误或警告。

让我们在本节中学习严格模式组件突出显示的项目列表。

不安全的生命周期使用

React 发现一些遗留的生命周期事件在基于异步的应用中是不安全的。它们如下所示：

• componentWillMount

• componentWillReceiveProps

• componentWillUpdate

不安全意味着它会在应用中产生难以调试的 bug。React 最终会在该库的未来版本中删除这些不安全生命周期事件。在此之前，开发者在使用遗留的不安全生命周期事件时会收到警告。

遗留 ref API 使用

早期版本的 React 使用基于字符串的 ref 管理，后来添加了基于回调的 ref 管理。推荐使用基于回调的选项，因为它更稳定，出错的可能性更小。如果我们使用基于字符串的选项，严格模式将发出警告。

最新版本的 React 提供了改进的 ref 管理选项，它既易于编写代码，出错的可能性也更小。

遗留的 findDOMNode 使用

findDOMNode 帮助搜索给定类实例的 DOM 节点树。findDOMNode 的使用已被弃用，并提倡使用基于 ref 的 DOM 管理。

副作用

React 有两个主要阶段，渲染和提交。渲染阶段涉及大量工作且耗时，而提交阶段则简单快捷。React 引入了并发模式，它将提高渲染阶段的性能。并发模式的要求之一是，在渲染阶段使用的生命周期事件不应包含副作用。

React 将尝试在开发阶段使用不同的方法查找意外的副作用，并将其报告为警告。

遗留的 context API

遗留的 context API 易于出错，不推荐使用。它将在未来版本中删除。在此之前，严格模式将检测遗留 context API 的使用并进行报告。

可重用的状态

具有可重用状态的组件可以在不产生任何副作用的情况下多次挂载和卸载，这将有助于提高应用的性能。未来版本的 React 库将在保留状态的同时添加或删除 UI 部分。React 18 引入了一项严格模式特性，它将尝试卸载并重新挂载组件以确保组件具有弹性。此阶段的任何问题都将被报告。