数据绑定迷思，暨 MVC 与 MVVM 傻傻分不清

之前的制作方式，我在《JavaScript 爱好者开发 Java Web 开发的“心路历程” 》文中有所整理。现在完成项目后，想想有这么几种数据绑定方式：一、服务器端 JSP 生成。读取接口 JSON 数据然后拼凑 HTML，这是方式安利应该是最快的，因为 JSP 和 数据库都在服务器本地。但因为 HTML 和数据的同时生成，用户体验反而较逊于“AJAX”的异步加载。而且需要在远端呈现一个 url。二、JSONP 异步调用。接口也是输出 JSON，所以只使用浏览器 JavaScript 脚本即可以调用数据，无须经过服务端或 JSP 渲染。优点是这样一种异步加载，可快速显示页面，然而通过 JSONP 异步调用数据。这样不仅显示速度较快，而且用户体验较好（先快速显示界面）。页面可不需要服务器支持，仅作为静态文件内嵌在客户端中，有接口便可，但不足就是修过静态页面必须经过客户端升级。于是可以将页面寄存在服务端中。我们的专题就是利用这个模式制作的。

以上两种的基本的数据绑定方式。由此封装的方案有 JSP Tags Files、自定义标签两种，分别是服务端和客户端（广义的客户端）生成的，有可以最终实现比较方便的调用数据。我想到的方式大概有这几种——至于哪一种最好应该没有一概而论。

……

以前总以为 MVVM 是 MVC 的派生，现在读了对岸的博文之后，才知道它们是两回事（对岸的中文解释总是更符合我胃口多些，一说就明白……目下所及，大陆人写的文章，往往不知所云呐……）

首先得強調一點，Knockout根本不是Angular的對手!! 倒不是因為Angular太強大，KO還沒上擂台就被叫去領便當；而是二者定位不同，KO只專注於MVVM，而Angular包含整套MVC。MVVM所聚焦的Data Binding只是MVC中實做View的一環，故二者不該直接相比，就像沒人會拿Office跟iPhone相比一樣道理，要比也是Windows Phone對上iPhone，定位才相近。Angular是完整的MVC架構，真要比較，對手應該是Durandal、Ember或Backbone，而Knockout隸屬Durandal陣營，所以應是Durandal vs Angular，哦哦...

http://blog.darkthread.net/post-2014-06-07-go-to-angularjs.aspx

更进一步说，就是：

兩年前初見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。

博主似乎更倾向于 NG 多些。不过我受过 ExtJS 的虐之后，对大型的库只敢远观~~