定義
SPA單頁面應用（SinglePage Web Application），指只有一個主頁面的應用（一個html頁面）衷戈，一開始只需要加載一次js呵曹、css的相關(guān)資源酱讶。所有內(nèi)容都包含在主頁面，對每一個功能模塊組件化裤园。單頁應用跳轉(zhuǎn)撤师，就是切換相關(guān)組件，僅僅刷新局部資源拧揽。
MPA多頁面應用（MultiPage Application）剃盾，指有多個獨立頁面的應用（多個html頁面）腺占，每個頁面必須重復加載js、css等相關(guān)資源痒谴。多頁應用跳轉(zhuǎn)衰伯，需要整頁資源刷新。
區(qū)別
1.刷新方式
SPA：相關(guān)組件切換积蔚，頁面局部刷新或更改
MPA：整頁刷新
2.路由模式
SPA：可以使用hash意鲸，也可以使用history
MPA：普通鏈接跳轉(zhuǎn)
3.用戶體驗
SPA：頁面片段間時間的切換快，用戶體驗良好尽爆，當初次加載文件過多時怎顾，需要做相關(guān)調(diào)優(yōu)。
MPA：頁面切換加載緩慢漱贱，流暢度不夠槐雾，用戶體驗比較差，尤其網(wǎng)速慢的時候
4.轉(zhuǎn)場動畫
SPA：容易實現(xiàn)轉(zhuǎn)場動畫
MPA：無法實現(xiàn)轉(zhuǎn)場動畫
5.數(shù)據(jù)傳遞
SPA：容易實現(xiàn)數(shù)據(jù)傳遞幅狮，方法有很多（通過路由帶參數(shù)傳值蚜退，Vuex傳值等等）
MPA：依賴url傳參，cookie彪笼，本地存儲
6.搜索引擎優(yōu)化（SEO）
SPA：需要單獨方案钻注，實現(xiàn)較為困難，不利于SEO檢索配猫，可利用服務器端渲染（SSR）優(yōu)化
MPA：實現(xiàn)方法容易
7.使用范圍
SPA:高要求的體驗度幅恋，追求界面流暢的應用
MPA：適用于追求高度支持搜索引擎的應用
8.開發(fā)成本
SPA：較高，長需要借助專業(yè)的框架
MPA：較低泵肄，但也頁面代碼重復的多
9.維護成本
SPA：相對容易
MPA：相對復雜
10.結(jié)構(gòu)
SPA：一個主頁面+許多模塊的組件
MPA：許多完整的頁面
11.資源文件
SPA：組件公用的資源只需要加載一次
MPA：每個頁面都需要自己加載公用的資源
