NextJSにおける通常メニューの問題点

前のレッスンでは、通常のリンクを使用して メニューを作成しました：

/src/comps/menu/menu.jsxexport default function Menu() {
  return <>
    <a href="/">home</a>
    <a href="/about">about</a>
    <a href="/price">price</a>
    <a href="/contacts">contacts</a>
  </>;
}

では、これに関連するいくつかの問題について 議論しましょう。問題は、このメニューのリンクを クリックするとページ全体がリロードされて しまうことです。これはSEOの観点からは 正しいですが、パフォーマンスの観点からは あまり最適ではありません。ページが リロードされると、コンテンツのみが 変更されるにもかかわらず、サイトの レイアウト全体を再度ダウンロードする 必要があります。最適なのは、ページの コンテンツのみをダウンロードすることです。

NextJSにはこの問題に対する解決策が 用意されています。これについては 次のレッスンで考察します。