Open2023/05/22にコメント追加1

Nuxt3 メモ

sinwio 2023/05/22

SSG（Static Site Generation）

Nuxt3では、ページの静的生成（pre-rendering）がサポートされています。この機能を利用することで、特定のページをビルド時にHTMLとして生成し、リクエストに対してすぐにそのHTMLを返すことができます。これにより、サーバーサイドでのレンダリングの必要性を排除し、レスポンスの高速化が期待できます。

メリット

パフォーマンス向上:
HTMLはビルド時に生成され、そのHTMLはそのまま返されます。これにより、レンダリングのための待ち時間を短縮できます。

SEO対策:
静的なHTMLを生成するため、検索エンジンのクローラが容易に内容を理解できます。これは、SEO（検索エンジン最適化）に非常に有利です。

スケーラビリティ:
生成された静的なHTMLはCDN等を通じて配信できるため、大規模なトラフィックに対してもスケールしやすいです。

設定方法

nuxt.config.js

defineNuxtConfig({
  nitro: {
    prerender: {
      routes: ['/pages/static']
    }
  }
})

npx nuxi generate

publicディレクトリに、HTML・CSS・JavaScriptを含むフルに機能するWebページ（statice.html）が生成されます。

[参考]