單頁應用（SPA）的特徵

單頁應用的優勢：
>快速。不須要發送請求、從新加載html/js/css。只有頁面的數據須要從新拉取。另外，vue支持替換組件時保存舊組件的狀態。
>更好的使用體驗。用戶不須要等待加載時空白的網頁。能夠添加過渡效果。例如，有的單頁網站在切換頁面時會有炫酷的進度條。

缺點：
>不利於搜索引擎排名（由於沒有真正發請求）。
>沒有瀏覽歷史記錄。但可經過js模擬。
>服務器在傳任何數據前須要檢查用戶權限（cookie）。
https://rubygarage.org/blog/single-page-app-vs-multi-page-app

 

單頁應用的通用模式：

每一個頁面都是一個組件。登錄、註冊是彈出的小窗體而不是單獨的網頁。
網頁主體是一個固定的組件。經過動態替換這個組件達到跳轉頁面的效果。
網頁主體組件上方是頁眉導航組件。
>動態替換組件：https://vuejs.org/v2/guide/components-dynamic-async.html

爲了模擬加載新頁面的歷史記錄效果，須要將舊的url推入歷史記錄並修改url，而且用戶返回舊的歷史記錄時不該從新加載舊的組件。

能夠經過監聽url將跳轉新頁面的行爲改爲替換組件。
https://stackoverflow.com/questions/46402809/vuejs-event-on-route-change

經過監聽返回/前進鍵，恢復url。
https://stackoverflow.com/questions/47974777/can-i-handle-back-button-within-methods-in-vuejs-2