Next.jsは自動的にコードを分割してくれる

Next.jsは自動的にコードを分割してくれるので、各ページはそのページに必要なものだけを読み込みます。つまり、ホームページがレンダリングされたときに、他のページのコードが最初に読み込まれることはありません。

これにより、何百ものページがあっても、ホームページの読み込みが速くなります。

リクエストしたページのコードだけを読み込むということは、ページが分離されるということでもあります。特定のページでエラーが発生しても、他のアプリケーションは動作します。

さらに、Next.jsの製品版では、ブラウザのビューポートにLinkコンポーネントが表示されると、Next.jsは自動的にバックグラウンドでリンク先のページのコードをプリフェッチします。リンクをクリックしたときには、リンク先のページのコードはすでにバックグラウンドで読み込まれており、ページの遷移はほぼ瞬時に行われます。

Next.jsは、コード分割、クライアント側のナビゲーション、プリフェッチ（本番環境では）によって、アプリケーションを自動的に最適化し、最高のパフォーマンスを実現します。

ページの下にファイルとしてルートを作成し、組み込みの Link コンポーネントを使用します。ルーティングライブラリは必要ありません。

Link コンポーネントの詳細については、ルーティングのドキュメントにある next/link およびルーティングの API リファレンスを参照してください。