Angular 與 Vue 的對比分析

　　異步加載模塊

　　在現在WEB開發中，前端的代碼量已經變得非常龐大，不可能再像以前那樣，把所有JS全部壓縮成一個文件，然后一次性全部加載。所以，無論你用什么樣的前端框架，異步加載模塊都是一個必備的功能。為了幫助初學者理解最基本的思路，畫圖示例如下：

　　以下是代碼塊和路由之間的對應關系（虛構的）：

　　http://localhost:4200/home chunk-0.js（10k）

　　http://localhost:4200/user chunk-1.js（10k）

　　http://localhost:4200/role chunk-2.js（50k）

　　http://localhost:4200/permission chunk-3.js（80k）

　　就算你不是前端開發者，你也能看出來，這樣好多了對不對？你不需要一上來就把所有js文件（一共150k）全部加載進來，只有當用戶開始使用某個菜單的時候，才去異步加載。很明顯，這是一個必備的特性，我們來看在Vue和Angular里面分別是怎么實現異步模塊的。

　　我們先來看Vue里面繁瑣的做法：

　　根據以上文檔，你首先要寫一下你已經寫好的Vue組件，然后自己再去利用webpack的code splitting特性自己寫配置文件。很明顯，當你的項目規模已經做得很大的時候，比如你已經寫了500個Vue組件，這時候你想切一下異步模塊，然后你就開始惡心了。首先你要把這500個組件都改一下，雖然每個組件改動的幅度不大，但是要改的數量還是挺多的！或者，當你發現某一些組件本來被打包在chunk-0.js里面的，但是由于業務上的修改，你現在必須把它們移動到chunk-1.js里面去，那對不起，請你自己到配置文件里面去慢慢改吧！