SSR
SSRで起きるHydration mismatchとは何か まずHydrationの前提を確認する mismatchはなぜ起きるのか 代表的な原因：時刻 乱数も危険 環境依存値 非同期データ mismatchが起きると何が起きるか なぜ開発環境では起きにくいのか 対策の基本方針 1. 時刻を描画し…
SPAにおけるHydrationの正体 まず前提：SPAは本来DOMを自分で作る SSRでは最初からHTMLが存在する Hydrationが必要になる理由 Hydrationで内部的に起きていること なぜHydrationが重いのか Hydrationが終わるまで何が起きるか よくある誤解 注意点 開発で気…
SSRでTTFBが遅くなるのはなぜか SPAとSSRの決定的な違い SSR内部で実際に起きている処理 データ取得の直列化** テンプレートレンダリング** 認証処理** DBアクセス** なぜユーザ体験が悪化するのか よくある誤った最適化 ボトルネックの特定方法 改善のため…
SSRはなぜSEOに強いと言われるのか 検索エンジンのクロールは2段階で行われる SPAで起きる問題 SSRで何が変わるのか クローラが実際に見ているもの 内部リンク評価の違い よくある誤解 実務上の対策 注意点 結局どう考えるべきか SSRはなぜSEOに強いと言われ…
SPAとSSRの違いは「描画場所」では説明できない SPAの責務：クライアントがアプリケーションになる SSRの責務：サーバがアプリケーションの主体 なぜ「描画場所」で説明すると誤解が起きるのか 責務分割が変わると何が変わるのか キャッシュ戦略** エラーの…
Next.jsとは？Reactとの違い Next.jsで書いた処理の例 Next.jsで書いたサーバサイドレンダリング処理の例 Next.jsで書いたサーバサイドレンダリング処理でAPIからデータを取得する場合の例 Next.jsとは？Reactとの違い Next.jsはReactのフレームワークの1つ…
