[Next.js] LinkコンポーネントとuseRouterの違い

はじめに

Next.jsの学習の為に、下記書籍を読みました。
下記書籍のLinkコンポーネントとuseRouterの違いについて情報を整理したかったので、執筆します。

結論

• useRouterは、
  プログラムによるページ遷移や現在のルート情報の取得に使用する。
  動的なナビゲーションや、特定のイベント後にページ遷移を行いたい場合に適する

• Linkコンポーネントは、
  ユーザーがクリックする静的なリンクを作成するために使用する。
  主に文書内のナビゲーションや、アプリケーション内の他のページへのリンクに適する

Linkコンポーネントについて

• ユーザーがクリックすることで別のページにナビゲートするための宣言的な方法を提供する
• 主に静的なリンクや、アプリケーション内の他のページへのリンクを作成する際に使用する
• ページ間のナビゲーションを高速化するために、クライアントサイドのナビゲーションを実現する->これにより、ページ遷移が高速になり、フルページのリロードを避けることができる

useRouterについて

• Next.jsのルーティング機能にアクセスするためのフックです。
• 現在のルートの情報を取得したり、プログラムによるページ遷移（例えば、フォームの送信後に別のページにリダイレクトする）を行う場合に使用する
• push、replace、queryなどのメソッドやプロパティにアクセスでき、これらを使って動的にページ遷移を制御したり、現在のURLのクエリパラメータを読み取ることができます。