Я пытаюсь лучше понять, почему все мои компоненты выполняют рендеринг при каждом изменении маршрута в React Router v5.Обратите внимание, что эти компоненты только перерисовывают , а не перемонтируют .Когда я открываю расширение реагирования в инструментах разработчика и устанавливаю флажок Highlight Updates, я вижу, что все мои компоненты обрисовываются в общих чертах при изменении маршрутов, даже те компоненты, которые находятся на более высоком уровне, чем сопоставление маршрутов:
<Router>
<MyHeader />
<ComponentWithRoutes />
</Router>
В этом простом примере я ожидал бы, что изменение маршрутов не приведет к повторной визуализации компонента MyHeader, поскольку ничего не меняется.Однако я все еще увижу основной момент с инструментами разработки.Я предполагаю, что это ожидаемо, поскольку все примеры в Документах демонстрируют одинаковое поведение.
Мой вопрос двоякий.1) Какова реальная причина повторного рендеринга компонента, подобного MyHeader?Не похоже, что какие-либо реквизиты или состояние меняются.Это из-за того, как маршрутизатор использует Context API?Маршрутизатор рендерит и заставляет детей перерисовывать?2) Почему это не считается расточительным?Кажется, что даже при том, что фактическое DOM не меняется, React все равно придется пройти этапы согласования в виртуальном DOM.Это так быстро, это не важно?Что происходит, когда вы начинаете иметь тонны вложенных компонентов?