多頁應用 |
單頁應用 |
| 一個項目中有多個完整的的HTML文件 | 一個項目中只有一個完整的HTML頁面（index.html） |
| 可以使用超鏈接、js實現頁面間的跳轉 | 可以使用改進後的超鏈接、js實現模板頁面間的切換 |
| 傳統的頁面跳轉是同步請求：在服務器生成響應內容時，客戶端是一片空白 | 模板頁面間的切換屬於經典的異步請求：直到下一個模板頁面來到，前一個模板頁面到來，前一個模板頁面才從當前DOM樹上刪除 |
| 頁面跳轉時，前一個DOM樹無用了，需要從瀏覽器中全部刪除，然後等待下一個DOM樹的到來 | index.html到來時，瀏覽器創建一個DOM樹。所有的請求都是xhr，到來時只需要作爲一個片段掛載在當前DOM樹——瀏覽器從始至終只有一個DOM樹 |
| 當網速比較慢時（尤其是移動端應用中時），用戶體驗極爲不好！ | 不會出現一片慘白的情形，瀏覽體驗好。 |
| 頁面切換時，DOM被完整的刪除，不可能有過場動畫！ | 頁面切換的本質是DIV的輪換，可以很容易實現漂亮的過場動畫。 |