Уменьшите количество повторных маршрутов с помощью React router

Question

В настоящее время я создаю веб-приложение среднего размера, и сегодня я проверил обновления моего дерева компонентов - и я был шокирован большим количеством повторных рендеров компонентов, которых я не ожидал.Я не хочу публиковать там все проблемы, но, возможно, решение одной из них может решить другие.

В моем веб-приложении у меня есть следующий код для навигационной ссылки, которая должна показывать, если посетительВ настоящее время одна эта страница с URL.Когда я перемещаюсь по моему веб-приложению, оно перерисовывается каждый раз, а не только при изменении его состояния.Как я могу это исправить?

const LinkedItem = ({ children, to, disabled = false }) => (
  <Route path={to} children={({ match }) => {
    if (match == null) {
      return (
        <li className="nav-item">
          <Link className={`nav-link ${disabled ? "disabled" : ""}`} to={to}>{children}</Link>
        </li>
      );
    } else {
      return (
        <li className="nav-item">
          <Link className={`nav-link active ${disabled ? "disabled" : ""}`} to={to}>{children} <span className="sr-only">(current)</span></Link>
        </li>
      );
    }
  }} />
);