SPA (Single Page Application,單頁應用) 是一種網頁應用的架構,整個網站只有一個 HTML頁面,使用者操作時不會整頁重新載入,而是透過 JavaScript + AJAX / Fetch API 來動態更新內容
index.html
和打包好的 JS、CSS優點:
缺點:
{
"rewrites": [
{
"source": "/:path*",
"destination": "/index.html"
}
]
}
適用情境:
Web App、Dashboard、後台管理系統(例如 Gmail、Notion、Figma Web)
SSR(Server-Side Rendering,伺服器端渲染)是一種在伺服器端先渲染出完整 HTML再回傳給瀏覽器的技術
優點:
缺點:
適用情境:
新聞網站、部落格、電商商品頁(需要 SEO 的地方)
https://medium.com/web-design-zone/搞懂前端技術名詞-ssr與spa-450563784c47
https://www.explainthis.io/zh-hant/swe/spa
https://yixuntseng-bruce.medium.com/五分鐘讀前端-為什麼需要ssr-server-side-rendering-d14ff524b820
https://www.instagram.com/p/Ch19-vmJpmv/