🔥【Vue.js → Nuxt 入門推薦！🌟 新書即將上市 🌟】
📘《想要 SSR 嗎？就使用 Nuxt 吧！Nuxt 讓 Vue.js 更好處理 SEO 搜尋引擎最佳化》
👀 Nuxt v4 內容與範例也可以參考並購買本系列文筆著所著書籍
📦 預計於 2025/08/14 出版，目前天瓏書局預購有 7️⃣8️⃣ 折優惠
👉 點此前往購買：https://pse.is/7yulwm

注意：Nuxt 4 已於 2025/07/16 釋出，本文部分內容或範例可能和最新版本有所不同

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。

客戶端渲染 Client-Side Rendering (CSR)

優點

• 渲染部分頁面
• 前後端分離
• 伺服器負擔較小

缺點

• 白畫面
• SEO

伺服器端渲染 Server-Side Rendering (SSR)

優點

• HTML 由後端渲染，客戶端渲染負擔較小
• SEO

缺點

• 頁面重新載入
• 伺服器端負擔較大

Hydration

Nuxt 3 的渲染模式

• 通用渲染 (Universal Rendering) 預設模式
• 產生靜態頁面 (Static Site Generation, SSG)
• 混合渲染 (Hybrid Rendering)
• 邊緣渲染 (Edge-Side Rendering, ESR)

感謝大家的閱讀，歡迎大家給予建議與討論，也請各位大大鞭小力一些：）
如果對這個 Nuxt 3 系列感興趣，可以訂閱接收通知，也歡迎分享給喜歡或正在學習 Nuxt 3 的夥伴。

參考資料

• Nuxt Rendering Modes