Ionic 7 ngOnInit executes again after navigating back to the page

ngOnInit seems to execute again after navigating back to the page that was previously initialize or loaded. My understanding based on the documentation is that ngOnInit should execute only once during initialization and ionViewDidEnter should fire every time the page is loaded or navigating back to the page.

We tried to load the pages in the following sequence to be able to replicate the issue wherein the ngOnInit runs again navigating back to the page:

  1. Home page is loaded by default when app starts (ngOnInit and ionViewDidEnter executed)
  2. Click Open Second page (ngOnInit and ionViewDidEnter executed)
  3. Click Open Third page (ngOnInit and ionViewDidEnter executed)
  4. Click Open Second page (only ionViewDidEnter executed) *which is what we expect
  5. Click Open Third page (ngOnInit and ionViewDidEnter executed) *we expect that only ionViewDidEnter should execute here

Issue seems to occur on browser, Android and iOS.

Is our understanding correct on how the ngOnInit works or we are missing something?

app.component.html

<ion-app>
  <ion-router-outlet></ion-router-outlet>
</ion-app>

app-routing.modules.ts

import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';

const routes: Routes = [
  {
    path: 'home',
    loadChildren: () => import('./home/home.module').then( m => m.HomePageModule)
  },
  {
    path: 'second',
    loadChildren: () => import('./second/second.module').then( m => m.SecondPageModule)
  },
  {
    path: 'third',
    loadChildren: () => import('./third/third.module').then( m => m.ThirdPageModule)
  },
  {
    path: '',
    redirectTo: 'home',
    pathMatch: 'full'
  },
];

@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule { }

home.page.ts

import { Component, OnInit } from '@angular/core';

import { Router } from '@angular/router';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage implements OnInit {

  constructor(
    private router: Router
  ) {}

  ngOnInit() {
    console.log('HomePage ngOnInit');
  }

  ionViewDidEnter() {
    console.log('HomePage ionViewDidEnter');
  }

  openSecond() {
    console.log('HomePage openSecond');
    this.router.navigate(['/second']);
  }

  openThird() {
    console.log('HomePage openThird');
    this.router.navigate(['/third']);
  }

}