為什么推薦使用 hash 模式？
創建項目時，vue-router 默認使用 hash 模式，設置模式的時候到底該使用hash還是history模式呢？
先了解它們的實現原理，搞清楚之間的區別，就知道什么時候該選擇什么模式了。
一、實現原理
hash 原理
hash 是通過監聽瀏覽器 onhashchange 事件變化，查找對應路由應用。通過改變 location.hash 改變頁面路由。
history 原理
利用 html5 的history Interface 中新增的 pushState() 和 replaceState() 方法，改變頁面路徑。
history Interface 是瀏覽器歷史記錄棧提供的接口，可通過 back、forward、go 等，可以讀取歷覽器歷史記錄棧的信息，pushState、repalceState 還可以對瀏覽器歷史記錄棧進行修改。
hash 與 history 區別對比：
| hash | history |
| 有 # 號 | 沒有 # 號 |
| 能夠兼容到IE8 | 只能兼容到IE10 |
| 實際的url之前使用哈希字符，這部分url不會發送到服務器，不需要在服務器層面上進行任何處理 | 沒訪問一個頁面都需要服務器進行路由匹配生成 html 文件再發送響應給瀏覽器，消耗服務器大量資源 |
| 刷新不會存在 404 問題 | 瀏覽器直接訪問嵌套路由時，會報 404 問題。 |
| 不需要服務器任何配置 | 需要在服務器配置一個回調路由 |
二、為什么推薦使用 hash 模式？
理由：
1、從兼容角度分析。
hash 可以兼容到 IE8，而 history 只能兼容到 IE10。
2、從網絡請求角度分析。
使用 hash 模式，地址改變時通過 hashchange 事件，只會讀取哈希符號后的內容，並不會發起任何網絡請求。
而 history 模式，每訪問一個頁面都要發起網絡請求，每個請求都需要服務器進行路由匹配、數據庫查詢、生成HTML文檔后再發送響應給瀏覽器，這個過程會消耗服務器的大量資源，給服務器的壓力較大。
3、服務器配置角度分析。
hash 不需要服務器任何配置。
history 進行刷新頁面時，無法找到url對應的頁面，會出現 404 問題。因為域名后面的路由是由前端控制的，后端只能保留域名部分，所以就會造成頁面丟失的問題，需要服務器端添加一個回退路由，就能解決該問題了。
hash 模式不足
1、hash 模式中的 # 也稱作錨點，這里的的 # 和 css 中的 # 是一個意思，所以在 hash 模式內，頁面定位會失效。
2、hash 不利於 SEO（搜索引擎優化）。
3、白屏時間問題。瀏覽器需要等待 JavaScript 文件加載完成之后渲染 HTML 文檔內容，用戶等待時間稍長。