SPAの動き
ブラウザから初回リクエストが来ると、サーバーは、JSのビルドファイルと最小限のHTMLファイルを返却する。
この段階では何も表示されない。
基本の中身のない空のタグだけ生成されて、中身はブラウザ上のJavaScriptがAPIを叩くことで、APIからのレスポンスをもとに初期表示との差分を更新する形でDOMを構築しHTML要素がレンダリングされる。
SSRの動き
サーバー側でAPIを叩き、レンダリングまでを行ってからHTMLファイルを返却する。
Node.jsが実行するので、この負担はサーバーにかかる。
それぞれのメリット・デメリット
SPAのメリット
・ユーザーの使いやすいぬるぬるUIの実現
・高速なページ遷移
・ PWA対応などしやすいらしい。
・ビルド済みのHTMLとJSファイルがホスティングサーバーにあれば動く
SPAのデメリット
・ 初期ローディングは時間がかかる（ブラウザ上でJSを実行する時間）
・ SEOで不利な可能性