一、引子

這個(gè)blog已經(jīng)荒廢將近一年了，久也不寫(xiě)，自然有很多的理由，但更多的怕是懶吧。不說(shuō)閑話(huà)了，轉(zhuǎn)入正題。

關(guān)于基于JavaScript的RIA客戶(hù)端數(shù)據(jù)處理這個(gè)話(huà)題，我打算分成兩篇文章來(lái)寫(xiě)，一篇陳述我所總結(jié)出的基于B/S結(jié)構(gòu)的RIA客戶(hù)端數(shù)據(jù)處理的問(wèn)題，另一篇?jiǎng)t陳述針對(duì)這些問(wèn)題我所提出的技術(shù)解決方案構(gòu)架。

二、RIA？RIA！

關(guān)于RIA尤其是基于Ajax的RIA怕是屢見(jiàn)不鮮了吧？尤其是在Google推手之后，文字處理、表格處理、幻燈片放映這種看起來(lái)非常客戶(hù)端的應(yīng)用，都可以采用Ajax的技術(shù)來(lái)實(shí)現(xiàn)了。作為一個(gè)關(guān)注企業(yè)級(jí)應(yīng)用開(kāi)發(fā)的技術(shù)人員，一個(gè)很自然的想法就會(huì)產(chǎn)生，是否可以采用這種技術(shù)來(lái)改進(jìn)我們基于Java EE技術(shù)開(kāi)發(fā)的B/S結(jié)構(gòu)的企業(yè)應(yīng)用呢？

先說(shuō)有沒(méi)有必要，答案是肯定的。B/S被廣為詬病的一個(gè)問(wèn)題就是降低了最終用戶(hù)的操作效率，以我的經(jīng)驗(yàn)來(lái)說(shuō)，用戶(hù)雖然普遍的感到基于瀏覽器的界面要漂亮得多，用鼠標(biāo)操作也很直觀，但是卻實(shí)在比以前的界面復(fù)雜而且操作困難。而且每次頁(yè)面提交后的等待也實(shí)在是對(duì)工作效率的一個(gè)降低。當(dāng)然，我這里也沒(méi)有必要意義列舉B/S在客戶(hù)端的缺點(diǎn)，實(shí)際上這個(gè)問(wèn)題是被廣泛認(rèn)同的。

再說(shuō)可行性，可行性分為兩種：技術(shù)上的可行性以及工程開(kāi)發(fā)上的可行性。

技術(shù)上的可行性就無(wú)須驗(yàn)證了，Google Reader、Gmail、Google Docs的穩(wěn)定運(yùn)行都是非常好的證明。

但是它是否一定適合時(shí)間要求相對(duì)比較嚴(yán)格的工程開(kāi)發(fā)呢？

這就需要一個(gè)非常穩(wěn)定的平臺(tái)來(lái)進(jìn)行支持，而且由于工程開(kāi)發(fā)的特殊性，最好還要有可視化的開(kāi)發(fā)和調(diào)試環(huán)境才更有說(shuō)服力。目前看來(lái)是沒(méi)有非常完善的，但是很多的Ajax框架，如Ext、GWT、Tibco GI以及服務(wù)端框架Struts2、JSF等，都在以自己的方式實(shí)現(xiàn)著。關(guān)于這個(gè)方面的探討我打算放到下一個(gè)系列《基于MDA的企業(yè)應(yīng)用RIA解決方案》里面討論，不在這里多費(fèi)口舌了。

技術(shù)上是可行的，而如果又一個(gè)非常穩(wěn)定和成熟的平臺(tái)支持的話(huà)，在工程開(kāi)發(fā)上也是可行的，那么這個(gè)平臺(tái)怎樣才算是穩(wěn)定和成熟的呢？本系列討論的就是其中的一部分，客戶(hù)端的數(shù)據(jù)處理。

三、定義、縮略語(yǔ)

1. RIA：Rich Internet Application的縮寫(xiě)。RIA是擁有傳統(tǒng)本地應(yīng)用的功能和效果的Web應(yīng)用。RIA一般把UI相關(guān)的處理交給了Web客戶(hù)端，但是大量的數(shù)據(jù)（包括應(yīng)用的狀態(tài)、數(shù)據(jù)等）還是交給服務(wù)端處理

2. Ajax：又寫(xiě)為AJAX，是"Asynchronous JavaScript and XML"的縮寫(xiě)。是一種使用瀏覽器技術(shù)進(jìn)行RIA開(kāi)發(fā)的技術(shù)

3. ECMA Script：由European Computer Manufacturers Association（歐洲計(jì)算機(jī)制造商協(xié)會(huì)）維護(hù)的一個(gè)腳本語(yǔ)言標(biāo)準(zhǔn)。當(dāng)前最通行的版本是ECMA-262 Edition 3，通常也被稱(chēng)為JavaScript 1.5

4. dojo：由dojo foundation管理的一個(gè)開(kāi)源JavaScript框架。提供了很好的JavaScript擴(kuò)展，目前被IBM和Sun等大公司支持和使用

5. Json： JavaScript Object Notation的縮寫(xiě)。它是一種純文本的數(shù)據(jù)對(duì)象傳輸協(xié)議，在Ajax的應(yīng)用中被廣泛采用

6. CRUD：Create（創(chuàng)建）、Retrieve（獲取）、Update（更新）和Delete（刪除）這四種簡(jiǎn)單的數(shù)據(jù)操作的縮寫(xiě)

7. Form：本文中的Form指的是經(jīng)過(guò)Ajax擴(kuò)展的簡(jiǎn)單的HTML電子表單。表單內(nèi)部可以擁有很多如ComboBox、TextBox等構(gòu)件。一般來(lái)說(shuō)，一個(gè)表單對(duì)應(yīng)著一個(gè)業(yè)務(wù)的數(shù)據(jù)對(duì)象

8. Tree：樹(shù)形顯示結(jié)構(gòu)化數(shù)據(jù)的構(gòu)件，由于數(shù)據(jù)是高度結(jié)構(gòu)化的，往往可以采用懶加載等技術(shù)來(lái)提高性能

9. Grid：以表格形式顯示和編輯數(shù)據(jù)的UI構(gòu)件。一般分為表頭（標(biāo)題欄）、表身（數(shù)據(jù)列表）和表尾（合計(jì)、狀態(tài)顯示等）三個(gè)部分。其中，表頭可以是復(fù)合的表頭，而表身可以是復(fù)合的格式（Tree、Grid、ComboBox、CheckBox等）。一個(gè)Grid可以有一個(gè)復(fù)雜的Grid定義

10. Enhanced Grid：下面簡(jiǎn)稱(chēng)為EGrid，是Grid的擴(kuò)展。在Grid的功能基礎(chǔ)之上提供了數(shù)據(jù)獲取和數(shù)據(jù)持久化的能力，可以大大的減少開(kāi)發(fā)應(yīng)用的時(shí)間（Ext中的Grid可以認(rèn)為是一個(gè)簡(jiǎn)化了的EGrid）

11. CodeList：代碼表，一般用在下拉列表數(shù)據(jù)處，在系統(tǒng)的實(shí)現(xiàn)中，由于性能以及標(biāo)準(zhǔn)的要求，下拉列表一般都是采用代碼保存數(shù)據(jù)，但是用戶(hù)在填寫(xiě)表單的時(shí)候需要看到正常的文字而不是代碼，這就需要系統(tǒng)通過(guò)CodeList進(jìn)行文字和代碼的轉(zhuǎn)換

12. LRU：Least Recent Used的縮寫(xiě)，是一種簡(jiǎn)單的緩存策略，如果緩存已滿(mǎn)，那么就釋放最近最少使用的那個(gè)緩存數(shù)據(jù)

13. REST：是REpresentational State Transfer的縮寫(xiě)，是一種基于輕量級(jí)WebService協(xié)議

四、客戶(hù)端數(shù)據(jù)處理的技術(shù)場(chǎng)景

• 數(shù)據(jù)綁定（Data Binding）

• 數(shù)據(jù)變更追蹤（Data Change Tracking）

• 數(shù)據(jù)訪問(wèn)（Data Access）

• 數(shù)據(jù)緩存（Data Caching）

• 數(shù)據(jù)查詢(xún)（Data Query）

• 數(shù)據(jù)處理（Data Processing）

4.1 數(shù)據(jù)綁定（Data Binding）

概念：

以非常簡(jiǎn)單的聲明方式實(shí)現(xiàn)Form、Grid這種數(shù)據(jù)填寫(xiě)、修改構(gòu)件與數(shù)據(jù)之間的對(duì)應(yīng)關(guān)系。

場(chǎng)景：

• Form綁定：把一個(gè)Form與一個(gè)數(shù)據(jù)對(duì)象通過(guò)聲明的方式綁定，使得Form的修改直接可以體現(xiàn)在數(shù)據(jù)對(duì)象中，而數(shù)據(jù)對(duì)象的修改也可以馬上由Form體現(xiàn)出來(lái)

• Grid綁定：把一個(gè)Grid和一個(gè)數(shù)據(jù)對(duì)象集合通過(guò)聲明或者設(shè)置數(shù)據(jù)源的方式綁定，使得在Grid上的寫(xiě)操作都可以體現(xiàn)在數(shù)據(jù)對(duì)象集合中，而數(shù)據(jù)對(duì)象集合的操作也可以馬上由Grid構(gòu)件體現(xiàn)出來(lái)

• Tree綁定：由于Tree的特殊性，與其說(shuō)Tree與一個(gè)數(shù)據(jù)對(duì)象集合綁定，不如說(shuō)Tree使用了一個(gè)可以根據(jù)查詢(xún)提供數(shù)據(jù)的數(shù)據(jù)來(lái)源更合適。當(dāng)然，由于Tree有可能被可視化的修改（如組織機(jī)構(gòu)管理），所以這個(gè)數(shù)據(jù)來(lái)源必須支持對(duì)數(shù)據(jù)的寫(xiě)操作

• 其它：如菜單的綁定等，相對(duì)于上述三個(gè)都屬于非常用的綁定，而且如果上述綁定能夠?qū)崿F(xiàn)，那么其他的綁定也可以采用同樣的技術(shù)實(shí)現(xiàn)

 4.2 數(shù)據(jù)變更追蹤（Data Change Tracking）

概念：

對(duì)數(shù)據(jù)的整個(gè)生命周期進(jìn)行追蹤。主要的目的就是可以通過(guò)記錄看出數(shù)據(jù)做了哪些改變，然后根據(jù)這些改變做出相應(yīng)的處理，其使用場(chǎng)景有Grid的變更提示、Form修改的追蹤等。

場(chǎng)景：

• Grid變更提示：在Grid中以明顯的方式提示用戶(hù)做了哪些修改

• 數(shù)據(jù)集合變更追蹤：根據(jù)變更的效果，可以有選擇的發(fā)送合適的數(shù)據(jù)給服務(wù)端進(jìn)行處理

• Form修改的追蹤：為用戶(hù)在提交Form時(shí)提示用戶(hù)哪些重要的字段進(jìn)行了修改提供支持

4.3 數(shù)據(jù)訪問(wèn)（Data Access）

概念：

服務(wù)端與客戶(hù)端數(shù)據(jù)傳輸?shù)母袷轿幢叵嗤覕?shù)據(jù)對(duì)象屬性的類(lèi)型等信息也需要一些Meta Data API來(lái)進(jìn)行支持。所以，抽象出一個(gè)抽象的擁有Meta Data的數(shù)據(jù)訪問(wèn)層是有意義的。

場(chǎng)景：

• 數(shù)據(jù)對(duì)象元數(shù)據(jù)信息訪問(wèn)：可以通過(guò)這些元數(shù)據(jù)信息了解數(shù)據(jù)對(duì)象的各個(gè)屬性以及對(duì)應(yīng)的數(shù)據(jù)類(lèi)型（這一點(diǎn)對(duì)于Json格式的數(shù)據(jù)傳輸尤其重要，因?yàn)?/strong>Json規(guī)范里面沒(méi)有DateTime類(lèi)型）

• 數(shù)據(jù)寫(xiě)操作的統(tǒng)一事件定義：通過(guò)Data Access API來(lái)訪問(wèn)數(shù)據(jù)，所有的寫(xiě)操作都會(huì)有統(tǒng)一的事件定義，在JavaScript 1.5中，普通的JavaScript對(duì)象是做不到的

• 統(tǒng)一的數(shù)據(jù)讀取方式：不管數(shù)據(jù)是XML格式的還是Json格式的，訪問(wèn)數(shù)據(jù)的方式都是統(tǒng)一的