認識一下前端架構VUE？

Vue是什麼？

什麼是VUE呢？它是一套建構使用者界面的漸進式前端架構，什麼是漸進式呢？就是用到哪一塊就用哪一塊，不用全部用上。Vue核心庫隻關注視圖層。這就提供了很明确的方向了。

Vue學習資源

vue.js中文官網： http://cn.vuejs.org/

vue.js源碼： https://github.com/vuejs/vue

vue.js官方工具： https://github.com/vuejs

vue.js官方論壇： forum.vuejs.org

對比下其他架構

Vue--VS--Angular

主要從三個方面進行對比它們的優缺點了：

• 在性能方面，這兩個架構都非常的快，我們也沒有足夠的實際應用資料來下一個結論。如果你一定想看些資料的話，你可以參考這個第三方跑分。單就這個跑分來看，Vue 似乎比 Angular 要更快一些。

  

• 在大小方面，最近的 Angular 版本中在使用了 AOT 和 tree-shaking 技術後使得最終的代碼體積減小了許多。但即使如此，一個包含了 vuex + vue-router 的 Vue 項目 (30kb gzipped) 相比使用了這些優化的 Angular CLI 生成的預設項目尺寸 (~130kb) 還是要小的多。
• 在靈活性方面，Vue 相比于 Angular 更加靈活，Vue 官方提供了建構工具來協助你建構項目，但它并不限制你去如何組織你的應用代碼。有人可能喜歡有嚴格的代碼組織規範，但也有開發者喜歡更靈活自由的方式。Angular難學些，Vue.js好學

Vue--VS--React

相同的部分

它們都有使用 Virtual DOM；提供了響應式（Reactive）群組件化（Composable）的視圖元件。将注意力集中保持在核心庫，而将其他功能如路由和全局狀态管理交給相關的庫。React 比 Vue 有更豐富的生态系統

• 資料綁定方面，vue實作了資料的雙向資料綁定，react資料流動是單向的
• virtual DOM不一樣,vue會跟蹤每一個元件的依賴關系,不需要重新渲染整個元件樹.而對于React而言,每當應用的狀态被改變時,全部元件都會重新渲染,是以react中會需要shouldComponentUpdate這個生命周期函數方法來進行控制
• state對象在react應用中不可變的,需要使用setState方法更新狀态;在vue中,state對象不是必須的,資料由data屬性在vue對象中管理（如果要操作直接this.xxx）

• 元件寫法不一樣, React推薦的做法是 JSX , 也就是把HTML和CSS全都寫進JavaScript了,即'all in js';

  Vue推薦的做法是webpack+vue-loader的單檔案元件格式,即html,css,js寫在同一個檔案