next.jsではなぜaタグではなくLinkを使うのかを先輩エンジニアに教えてもらったので備忘録
結論から言うと、
- ページの読み込みを早くするため
- reactの状態変化を維持したままページ遷移を行うため
説明すると、
aタグはサーバーから別のページを取得するリンク
Linkタグは同一ページ内で見た目だけ変更するリンク出そう。
Linkタグで同一ページ内で一部分だけ変更する場合、
サーバーとの通信が省略されるのでページの読み込みが格段に早くなる。
そして、ページが更新されてしまった場合reactの状態(state)がリセットされてしまうけど、
Linkタグで同一ページ内で一部分だけ変更する場合、状態(state)が維持されたまま次のページに移動できる。
と言うことみたいです。