Как настроить вложенные маршруты? Верхний уровень или уровень компонентов?

Question

У меня есть следующая схема маршрутизации

/tasks (Tasks Overview Page)
/tasks/:id (Task Detail Page)
/tasks/:id/:recordId (Single Task Page)

Если я go через вложенную документацию маршрута на React Router , реализация будет выглядеть примерно так

<Switch>
  <Route exact path="/">
    <TasksPage />
  </Route>
</Switch>

Затем страница TaskDetail будет реализована следующим образом:

<Switch>
  <Route exact path={path}>
    <TaskList />
  </Route>
  <Route path={`${path}/:slug`}>
    <TaskDetail />
  </Route>
</Switch>;

Затем страница TaskDetail будет дополнительно вкладывать маршруты для отображения одной страницы задачи.

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

Я бы предпочел реализовать следующую схему маршрутизации

<Switch>
  <Route exact path="/tasks">
    <TaskList />
  </Route>
  <Route path="/tasks/:taskId">
    <TaskDetailPage />
  </Route>
  <Route path="/tasks/:taskId/:recordId">
    <RecordDetailPage />
  </Route>
</Switch>;

Является ли подробная схема некорректной в любом случае? Или это просто вопрос предпочтений, и я свободен в любом случае?