Next.jsのチュートリアルを終了したので雑で断片的なまとめ
概要
Next.jsのチュートリアルを終了した。
雑なまとめを書きたいと思ったが、ZennやQiitaなどのプラットフォームに書くことではないと思ったので、こっちに書く。
雑で断片的なまとめ
Fast Refresh
たしかに開発環境での変更箇所のブラウザへの反映（Refresh）は少し速かった。ただ「これってそこまで速いのかな？」とはなった。業務ではGatsby.jsを使っており、Gatsby.jsもFast Refreshを同様に謳っているので、いずれにせよ速いということで、そこまでの恩恵を感じれなかったのかもしれない。
Linkの中にはaタグを入れる
Linkコンポーネントは、中に文字列を入れるだけでもページ遷移自体はできる。理由は、自動でaタグを挿入してくれるため。しかしその形はDeprecated（非推奨）なので、やはりLinkの中にはaタグを入れるのがよさそう。
クライアント側でのページ遷移
Linkが提供してくれるのはサーバーを挟んでのページ遷移ではなく、JavaScriptによるクライアント側での遷移。サーバーを経由していないので、合計の処理時間が短い。ページ遷移の速さは結構感じた。
code splitting
Next.jsは自動的にコードを分割するから、どのページも必要な時だけローディングを行う。つまりトップページがレンダリングされた際も、他のページのコードが最初から供給されている、というわけではない。
なので、サービスが数百のページを抱えていたとしても、トップページのローディングは素早く行えることが保証される。
またページがそれぞれ独立しているので、もしあるページでエラーが発生したとしても、アプリの残りの部分は動き続ける。優秀。
hydration
ページがブラウザによってローディングされる際に、中にあるJavaScriptコードが走ってページ全体をインタラクティブにする。この過程をhydrationと呼ぶ。
next-env.d.tsはいじってはダメ
next-env.d.tsはいじらない方がいいファイルらしい（いじろうとしてた）。
感想
チュートリアル、原文も結構分かりやすかったけど、英語読むのが大分めんどうだったのでこちらの記事と2窓で読み進めてた。
