データ量が多くページ遷移をするときにかなり時間がかかってしまうようなケースが存在する
その場合routerの状態を監視してイベントを付与するのがよい
Next.jsにおいてはルーティング情報がuseRouterなどから取れる
そのためNextのLinkタグを使った遷移をするとイベントを監視することもできる

const router = useRouter();

// ルーティングイベント発生時にイベント発火
router.events?.on('routeChangeStart', () => {});

// ルーティングイベント終了時にイベント発火
router.events?.on('routeChangeComplete', () => {});

// ルーティングイベントのエラー時に発火またはルートのロードがキャンセルされた場合
router.events?.on('routeChangeError', () => {});

参考
Loading Screen on next js page transition