從Knockout到AngularJS
兩年前初見Knockout.js後便一腳踏入MVVM世界無法回頭。學習簡單很快上手，用Knockout做出錯誤少又容易擴充維護的AJAX網頁。在此之前，爲了讓字段連動，總要寫一堆<input>、<select> onchage、onclick事件，事後常需要在一堆事件程序代碼裏追查更動來源，更糟的是稍一調整就常因觸發順序改變導致錯誤，修改維護是件苦差事；改用KO後，專心把ViewModel邏輯寫好，餘下的字段連動便能一次到位，加上邏輯都集中寫在ViewModel內，維護起來輕鬆許多。
不過，最近參與SPA項目(Single Page Application，指從頭到尾沒有任何PostBack，停在同一網頁裏完成全部工作的網頁，最經典的例子是Gmail)，逐漸感受單靠Knockout(或者該說MVVM)的不足。SPA需在同一網頁切換不同操作接口，當接口複雜度提高，網頁HTML、JavaScript開始龐大交錯，管理及維護難度急速上升。面對這類情境，引用JavaScript端MVC設計模式讓架構分明，簡化維護難度，是較好的選擇，而Knockout只專注於MVVM，仍需要其他MVC架構輔助才容易建構成SPA。
經過粗淺評估，目前市場上較常提及的JavaScript MVC架構包含: Angular、Ember、Backbone及Durandal(杜蘭德爾，中古世紀聖騎士羅蘭的配劍名字)。由於我的後端一定是用ASP.NETMVC開發，故整合資源、參考數據的多寡將是考慮關鍵，以此標準，就是Angular JS或Durandal二選一了。
Angular JS擁有最大的開發社羣，是幾個架構中最夯的，氣勢驚人。而選擇Durandal的優勢在於Knockout!MVVM也算是MVC裏的一環，Angular有自己一套處理MVVM的做法，而Durandal則直接採用Knockout處理MVVM，微軟傳教士JohnPapa也曾針對Durandal有一系列的介紹，對我而言，已累積的KO知識在應用Durandal時將可發揮，感覺上Angular與Durandal各有優勢。看似兩難的抉擇，其實至今局勢已大幅改變~
在今(2014)年初，Open Source的Durandal啓動了一個集資計劃(Kickstarter)，雖然創始人Rob聲明說即使集資不成仍會持續發展，只是開發速度趨緩，但已令人憂心Durandal的發展動能及前景。到了4月中，Angular的部落格上有篇很特別的文章，作者是Rob Eisenberg -- 是的，就是剛說的Rob，Durandal的創始者(Rob還打趣的說，大家不要驚慌，他不是靠Heartbleeding漏洞駭進AngularBlog偷發文)，文中透露驚人的消息。Rob從2月起已加入AngularCore 2.0 Team，計劃將原本Durandal下一代(NextGen)的構想融入Angular2.0，同時提供Durandal2.x遷移到Angular的途徑，Durandal2.x仍會繼續維護(但可預期將不再有新版本)，此舉如同宣告Durandal的發展已劃上句點。
發展至此，微軟不再(也無法)漠視Angular的成長並開始擁抱Angular(令我憶起當年AJAX Control與jQuery的瑜亮故事)，John Papa近期有愈來愈多談Angular整合的文章，前陣子結束的北美TechEd還有場談ASP.NET+Angular建立RIA的議程。由此不難得感受，使用Angular建構ASP.NETSPA已是當今的主流!
最後，我很倚重的Kendo UI組件爲Angular再下一成。前陣子發表AngularKendo UI v1.0，方便Angular整合Kendo UI，雖然KO也有社羣發展的knockout-kendo可用，但AngularKendo UI由官方推出，二者層級有別，也算Angular穩坐前端MVC一哥地位的左證。
分析至此，態勢明顯，如果要走ASP.NET SPA，Anuglar纔是主流選擇!! 廢話不多說，立刻向Angular出發~
但，Knockout該何去何從?
首先得強調一點，Knockout根本不是Angular的對手!! 倒不是因爲Angular太強大，KO還沒上擂臺就被叫去領便當；而是二者定位不同，KO只專注於MVVM，而Angular包含整套MVC。MVVM所聚焦的DataBinding只是MVC中實做View的一環，故二者不該直接相比，就像沒人會拿Office跟iPhone相比一樣道理，要比也是WindowsPhone對上iPhone，定位才相近。Angular是完整的MVC架構，真要比較，對手應該是Durandal、Ember或Backbone，而Knockout隸屬Durandal陣營，所以應是Durandalvs Angular，哦哦...
這段時間，其實我已投入不少時間熟悉瞭解AngularJS，Angular在語法簡潔性(自定義Directive及Filter的概念很酷)、架構彈性(可動態加載切換View、Dependency Injection的點子很棒)、可維護性(甚至已考慮自動測試需求)方面考慮嚴謹周延，常讓我發出讚歎(回頭看到自己的土炮架構，不禁發出感嘆)。但在Binding運作上，Angular不像KO靠宣告observable()、observableArray()建立依賴關係，而是直接觀察Scope內JavaScript對象的改變自行建立相依。雖然Angular宣告ViewModel時不必寫成observable()、observableArray()很省事，但面臨較複雜的字段互動邏輯，初學者常難以判斷某個動作是否會被Angular感測。除此之外，Angular涉及MVC，整體架構範圍比MVVM龐大，而官方技術文件較Knockout深澀。依我個人看法，Angular的學習曲線較Knockout陡峭許多。在一些簡單的ASP.NETAJAX應用場合，如果只是需要一套MVVM機制，Knockout較好學習上手，而observable/observableArray宣告雖然囉嗦，但應用時容易區分是否觸發UI連動，還是很有優勢。
至於我的選擇? 由於項目會走向SPA，Angular是強大、完整、嚴謹、彈性的主流MVC架構工具，並已廣爲ASP.NET社羣接受，就算學習曲線陡峭如同單攻奇萊主峯，也得咬牙吞下去，着眼熟悉活用後帶來好處。近期將會陸續分享我的Angular學習筆記，一連串KO之後，NG要上場囉~
