多款優秀的 JS MVC 框架對比

正如以前說的，產品生產有功能時代轉入體驗時代，產品爲王，體驗爲王，已是時代趨勢。體驗經濟的到來，說明前端的技術要求愈來愈高，完成功能是不行的，還要有優秀的體驗。
        因此相似原來的jquery時代相似於傳統的彙編或者是C時代的編程，這個階段已經不work了。前端的技術即將邁入模式時代，MVC時代。應此而生，如今有大量的前端MVC框架技術不斷出現。下面咱們挑選幾款表明性的前端框架進行對比，以作參考。
1.  Backbone.js 




Backbone.js是web很是火的框架，衆多知名品牌均支持該框架，使人印象深入，天然地成爲最早進行嘗試的框架。用它來建造了一個Group Talent內部用行政管理方面功能的feature應用。 




優勢：強大的社區，還有大量的實力支持。例如它自己就較多地使用了Underscore.js（也是一個強大的框架）。 




缺點：抽象功能不夠強，以及一些須要的功能還沒實現。整個框架十分輕量級，產出的結果是一大堆引用文件和樣板：並且應用的規模越大這一點就會越明顯。 




2.  SproutCore 1.x 




SproutCore最開始是蘋果公司用於其iCloud上面的。除了名字起得很很差以外，它其實是一個很是優秀的框架，也是最大的框架之一。 




優勢：支持綁定，忠實的社區粉絲，優秀的feature不少。 




缺點：過於死板，難以去除無用的feature，強制使用一種Native風格的範例，嚴重的狀況在於該框架不容許使用HTML來作佈局。 




3.  Sammy.js 




Sammy是偶然發現的一個比較小的框架，由於它太簡化了，基本不能佔據列表的席位。其核心feature是一個路由系統，讓應用與AJAX進行交換。 




優勢：簡單的學習曲線，與服務器端的app集成更加容易。 




缺點：太過於簡單，對於大型應用就有些捉襟見肘。 




4.  Spine.js 




器如其名，Spine顯然是受到Backbone的強烈影響，像Backbone同樣也是一個很是輕量級的框架，遵循類似的模型。 




優勢：輕量級，文檔作得很好。 




缺點：從根本上就有缺陷。Spine的一個核心概念是「一個堅果外殼中的一堆異步的UI集，這意味着UI應該是在理想化條件下永遠不會阻塞的」。而作了一系列的非阻塞式實時應用以後，能夠說這簡直是不現實的，除非後端是像Operational Transformation之類的。 




5.  Cappuccino 




Cappuccino是一款更加獨特的框架，自帶編程語言Objective-J，還能嘗試着在瀏覽器中仿真Cocoa。 




優勢：大型的構想出的框架，良好的社區環境，強大的繼承模型。 




缺點：在您全部能用Javascript仿真的語言以外，Objective-C是最不想選用的。它起源一位iOS開發人員，到如今還沒想明白用瀏覽器編寫Objective-J是什麼意思。 




6.  Knockout.js 




K.O.是一個MVVM框架，受到其支持者的大量好評。它強調陳述式UI綁定和自動UI刷新。 




優勢：支持綁定，文檔作得出色，引導系統超級贊。 




缺點：綁定語法晦澀，缺少堅實的視圖組件層次結構。但願可以輕鬆地重用組件，也以爲定義成一個MVVM框架是有害的。這些框架中基本沒有MVC，但都是（MVP,MVVM之類的）的變種。 




7.  Breeze Js




國產貨，衆聯無限開發的一套獨立自研的前端MVC框架。他的概念頗有意思，就是將後端開發語言，如Java，的概念模擬應用到前端。有class有繼承，能實現模板和應用綁定。








優勢：概念模擬，學習成本低，上手快。封裝很薄，擴展性和兼容性都很好






缺點：相關的組件和第三方資源比較少，依賴jquery和seajs






8.  Google Web Toolkit 




GWT是一系列的客戶端工具包，除了框架以外還包含不少其餘工具。它能夠把java語言編譯成Javascript，支持標準Java庫的一個子集，最初是Google公司使用在Wave上面的。 




優勢：綜合寬泛的框架，擁有強大的社區支持。基於Java的堅實組件繼承模型，在巨型客戶端應用上表現出色。 




缺點：除了Google說的以外，GWT將經不住時間的檢驗。就好像最初DART那樣，很明顯Java不是web的將來。更嚴重的是，客戶端對於Java的抽象有一點不合適。 




9.  Google Closure 




若是說Google Closure僅僅是一個js框架，倒不如說更像是一個工具包。附帶編譯器和優化器。 




優勢：由Google用在其不少主流app上面。良好的基於組件的UI編寫系統。 




缺點：不支持UI綁定。 




10.  Ember.js 




Ember（以前是SproutCore 2.0）是競爭者中的新丁。它是一個嘗試：從SproutCore2.0中抽取分離其核心feature並轉變成爲一個更加緊湊的模型框架，更加適合web。 




優勢：特別豐富的模板系統，擁有可編寫的視圖和UI綁定。 




缺點：因爲太新，文檔跟不上。 




11.  Angular.js 




Angular是在發佈評估結果以後才發現的一個很好的框架，由Googler開發，包含了不少有趣的設計選擇。 




優勢：關於模板的範圍和控制器的設計考慮的很周到。具備依賴注入系統。支持豐富的UI綁定語法，從而使得過濾和轉換這樣的工做開銷很小。 




缺點：代碼庫很不健全，也不夠模塊化。視圖也不夠模塊化（關於這點在Batman.js的缺陷中討論的更加細緻） 




12.  Batman.js 




Batman由Shopify創做，是另外一款與Knockout和Angular具備類似脈絡的框架。Batman擁有良好的UI綁定系統，是基於HTML屬性的。Batman是惟一的一款使用慣用語法Coffeescript編寫的框架，而且緊密地與NODE.Js集成在一塊兒，甚至能夠到擁有其（可選的）Node.js服務器的程度。 




優勢：代碼庫十分清晰，綁定方法優良又簡單，耐用，流程化。 




缺點：很是不喜歡這種「獨行俠」式的做風，更不用說這種增強單一控制器的主意了。與Knockout和Angular同樣，在組件嵌套的時候遭受一樣的折磨。須要的不只僅是模板，還更想要陳述式的可重用的模板框架。相比，Ember在框架之上擁有的是一個基於EMBER他們本身的邏輯（多是在控制器層上的）的整套組件能陳述式重用的方法。