Question

<BrowserRouter>
    <App />
</BrowserRouter>

假设App组件呈现Header（链接列表）和Main（路线列表）组件。从一个Link导航到另一个Link是否重新呈现App组件？

Answer 1

React仅重新提供已更改的组件。

当您使用react-router并在页面之间进行路由时，react将查看旧的DOM，将其与新DOM的版本进行比较，然后仅更新已更改的部分。

旧DOM（在javascript中）的副本也称为虚拟DOM。这使得反应能够如此快地进行渲染，因为它仅会重新渲染已更改的DOM元素。渲染DOM通常是一项耗费资源的工作，而react的渲染机制允许最少的渲染量，因此具有相对较高的性能。

从一个链接导航到另一个链接是否会重新渲染App组件？

假设您的<App />组件是根组件，则不会重新呈现此特定组件。但是，它将更改在路由过程中已更改的所有组件。

例如，我们有一个非常简单的应用程序，其中包含文本部分和标题。假设我们现在正在使用React Router进行导航，文本部分会更改，但标题保持不变。现在react只会重新渲染（更改DOM）文本部分，而保留标题部分不变（DOM没有变化）。