單頁應用

什麼是單頁應用？

單頁應用是指在浏覽器中運作的應用，使用期間不會重新加載頁面。

那麼單頁應用與傳統網站的差別又是什麼呢？

傳統網站使用者的操作會重繪整張頁面，浏覽器從伺服器擷取資料時，頁面會閃爍，然後重繪頁面上所有的東西。當頁面很大，伺服器又繁忙時，這種閃爍會持續幾秒鐘甚至更長時間，造成使用者糟糕的體驗。

那麼單頁面應用呢？單頁面應用會盡可能把工作資料和處理過程從伺服器端轉移到浏覽器端，将響應時間減少。單頁面應用在本地擁有大多數需要決策判斷的資料和業務邏輯，是以是很快的。

還有單頁面和網站一樣可以即時更新并且使用者不用做任何事，但是桌面應用則需要安裝新版本以及管理通路的權限。單頁應用是運作在現代HTML5浏覽器上，在任何作業系統上運作。

那麼單頁應用的運作過程是怎樣的呢？單頁應用一開始加載必要的HTML、CSS、JavaScript，之後所有的操作都是在這張頁面上完成，一切有JavaScript控制，是以單頁應用往往包含大量的JavaScript，複雜度很高，是以需要子產品化的開發和設計。

最後就是單頁面的優缺點分别是什麼呢？

優點：

1、無重新整理體驗

路由分發直接在浏覽器端完成，頁面是不重新整理，對使用者的響應非常及時，提升了使用者體驗

2、 前端元件化

前端開發不再以頁面為機關，更多地采用元件化的思想，代碼結構群組織方式更加規範化，便于修改和調整。

3、API共享

如果你的服務是多端的（浏覽器端、Android、iOS、微信等），單頁應用的模式便于你在多個端共用 API，可以顯著減少服務端的工作量。

4、元件共享

對性能體驗要求不高的場景，或者産品處于快速試錯階段，借助于一些技術（Hybrid、React Native），可以在多端共享元件，便于産品的快速疊代，節約資源。

缺點：

1、首次加載大量資源

在一個頁面上為使用者提供産品的所有功能，是以頁面加載的時候需要大量的靜态資源，加載時間較長。

2、較高的開發門檻

對前端工程師要求提高，工作量也增加數倍

3、不利于seo

單頁頁面，資料在前端渲染，就意味着沒有 SEO，或者需要使用變通的方案。