ЯжПрограммист.com

Как настроить маршрутизацию в Angular, чтобы предотвратить дублирование страниц при навигации? Какие стратегии можно использовать для управления активными маршрутами и их состоянием, чтобы избежать лишних рендеров компонентов или повторной загрузки данных при переходе между маршрутами?

Чтобы в Angular избежать дублирования страниц при навигации и лишних ререндеров, вот несколько фишек:
onSameUrlNavigation: 'reload' | 'ignore' – по умолчанию игнорит повторные переходы на тот же URL. Если надо обновлять данные, ставь 'reload'.
RouterModule.forRoot(routes, { onSameUrlNavigation: 'ignore' })
Reuse Strategy – можно кешировать компоненты и восстанавливать их состояние при возврате. Например, через RouteReuseStrategy.

runGuardsAndResolvers – если хочешь, чтобы гварды и резолверы срабатывали только при изменении параметров, ставь 'paramsOrQueryParamsChange'.
{ path: 'profile/:id', component: ProfileComponent, runGuardsAndResolvers: 'paramsChange' }
RouterOutlet и key – если компонент должен обновляться при каждом переходе, можно использовать ключ:
<router-outlet [key]="route.snapshot.url"></router-outlet>
State Management (NgRx, сервисы) – вместо повторной загрузки данных храни их в сервисе или сторе.

Итого: играешься с onSameUrlNavigation, RouteReuseStrategy, правильно настраиваешь runGuardsAndResolvers и юзаешь стор для данных