Nextについて調べると、大きな違いとして、SSG/SSRについて書かれています。
これが自分の中で腑に落とせたので、メモしておきます。
SSG：静的サイトの生成（Static Site Generation）
SSGは、JavaScriptを完全に読み込む前に、静的サイトを表示できる仕組みのことです。
静的サイトとは、最初から決められたコンテンツしか表示しないサイトです。
ざっくりとした理解であれば、HTML/CSSのみで組まれたサイトという認識で良いと思います。
この反対を動的サイトといいます。
SSGのメリット
Next.jsはReactと違い、最初の読み込み時に静的サイトを表示することができます。
よって画面のチラツキを最小限に抑えることができるわけです。
動的サイトとは？
静的サイトとは反対に、ユーザーの入力によってコンテンツを変化させることができるサイトのことです。
例）
- タイピングの結果を表示する（フロントエンド）→ブラウザ上で動くJavaScriptを使う
- 入力した条件に応じた結果を表示する（バックエンド）→サーバー上で動くPHP/Ruby/Javaなどを使う
SSR：サーバー（Server-side Rendering）
SSGに対して、こちらはサーバーへのリクエストを処理して表示する仕組みのことです。
バックエンドで行われていることと近いです。
しかしバックエンドの処理と違うのは、Next.jsは差分のみ更新して表示するので、ページ全体のリロードが不要で早いことです。
（書いていると、Reactってそういうのできないん？って疑問になりますが）
まとめ
読み込み・表示速度を比較すると、
SSG > SSR > 全読み込み（バックエンド）
という感じです。
しかしSSGは静的サイトしか表示しないので、SSRのような汎用性はありません。
これだけみるとバックエンド要らなくね？ってなりますが、重たい処理や精度が必要な処理は、普通にバックエンドに任せるべきだと思います。
例えば大量のデータ処理なら、ブラウザでやるよりサーバーの強力なコンピューターで処理した方が適切です。
ブラウザでやると、メモリが一瞬でパンパンになって、動かなくなりますので泣