NextJS:SSG(Static Site Generation)
静的サイト生成(SSG)は、Next.jsの強力な機能で、事前にページを生成してパフォーマンスを最適化します。
概要
- SSG(スタティックサイトジェネレーション)とは
- Next.jsのSSG・スタティックサイトジェネレーションは、ビルド時にデータベースやAPIからコンテンツを取得し、静的なHTMLを事前生成する最適化機能です。
- 以降のリクエストではデータ取得を必要とせず、CDNからの高速な配信が可能となります。
- これにより、最高のパフォーマンスとユーザー体験を実現し、検索エンジン最適化・SEOにも優れた効果を発揮します。
- また、Next.jsの公式でもSSGを推奨しています。
- ただし、一度SSGが適用されると、データに変更があったとしても、特別なアプローチを取らない限り、更新は反映されないので注意が必要です。
主な特徴
- 最高のパフォーマンス
- ビルド時にHTMLを生成
- CDNからの高速配信が可能
- ユーザーリクエスト時の処理が最小限
- SEOに最適
- 完全なHTMLがクローラーに提供される
- インデックスが容易
- 高い信頼性
- サーバー負荷が少ない
- データベースへの依存が少ない
ユースケース
- 適用に適したサイト例
- ブログ
- ドキュメントサイト
- マーケティングページ
- ポートフォリオサイト
制限事項
- 制限事項
- リアルタイムデータの表示には不向き
- 頻繁な更新が必要なコンテンツには適さない
💡 Next.js公式推奨:可能な限りSSGの使用が推奨されています


