Ｆｌａｐｊａｘ在Ａｊａｘ技術中的應用研究

摘要：Flapjax是一種構建 Ajax（Asynchronous JavaScript and XML）應用程序的新方法，它是一種基于標準 JavaScript 的符合傳統語法的新型編程語言，它不僅僅是提供方便的函數庫，它可以在 web 應用程序中輕松地實現外部 Web 服務進行交互、數據共享、數據持久化以及最終用戶響應性。該文通過多個 web 應用程序示例展示了幾種不同模式下編寫和運行簡單的 Flapjax 程序，并以此闡述了Flapjax在簡化 Ajax 編程技術方面的作用。

關鍵詞：Flapjax；Ajax；RIA；JavaScript；Xml；B/S

中圖分類號：TP311文獻標識碼：A文章編號：1009-3044(2008)22-654-03

Flapjax Ajax Technology in the Application of Research

JI Gao-yun

(Shandong Transport Vocational College，Management.Weifang 261206，China)

Abstract:Flapjax is a new method to construct Ajax (Asynchronous JavaScript and XML) application，it is a new programming language based on standard JavaScript and it conforms to the traditional grammar.It not only provides the convenient functions library，but also it can easy implement so many other characters，such as exterior Web service，data sharing，the data alternately lasting and as well as the end-user responsiveness in the web application. This article had demonstrated how to program and execute Flapjax through many web application demos under several kind of different patterns，then elaborated Flapjax's simplify functions in the Ajax programming technology.

Key words:Flapjax;Ajax;RIA;JavaScript;Xml;B/S

1 引言

傳統網絡程序的開發是基于頁面與服務器端數據傳遞的模式，把網絡程序的表示層建立于HTML頁面之上。而HTML是適合于文本的，傳統的基于頁面的系統已經漸漸不能滿足網絡瀏覽者的更高的、全方位的體驗要求了，這就是被Macromedia公司稱之為的“體驗問題”，而富因特網應用程序（Rich Internet Applications，縮寫為RIA）的出現也就是為了解決這個問題。AJAX（Asynchronous JavaScript and XML）是RIA的解決方案之一，并在近幾年迅速的發展壯大。Flapjax就是應現代基于客戶端的Web應用的需求而設計的，Flapjax 提供了一種比傳統JavaScript更加簡便的編寫 Ajax 程序的方法，應用程序開發人員可以把更多的精力投入到表示層的工作中。

2 Ajax技術

2.1 Ajax定義

嚴格來說Ajax不是一種技術，它由幾種蓬勃發展的技術以新的強大方式組合而成，它使瀏覽器可以為用戶提供更為自然的瀏覽體驗。在Ajax之前，Web站點強制用戶進入提交/等待/重新顯示范例，用戶的動作總是與服務器的“思考時間”同步。Ajax提供與服務器異步通信的能力，從而使用戶從請求/響應的循環中解脫出來。借助于Ajax，可以在用戶單擊按鈕時，使用JavaScript和DHTML立即更新UI，并向服務器發出異步請求，以執行更新或查詢數據庫。當請求返回時，就可以使用JavaScript和CSS來相應地更新UI，而不是刷新整個頁面。最重要的是，用戶甚至不知道瀏覽器正在與服務器通信：Web站點看起來是即時響應的。

雖然Ajax所需的基礎架構已經出現了一段時間，但直到最近異步請求的真正威力才得到利用。能夠擁有一個響應極其靈敏的Web站點確實激動人心，因為它最終允許開發人員和設計人員使用標準的HTML/CSS/JavaScript堆棧創建“桌面風格的（desktop-like）可用性。

2.2 現狀與需要解決的問題

傳統的Web應用采用同步交互過程，這種情況下，用戶首先向HTTP服務器觸發一個行為或請求的呼求。反過來，服務器執行某些任務，再向發出請求的用戶返回一個HTML頁面。這是一種不連貫的用戶體驗，服務器在處理請求的時候，用戶多數時間處于等待的狀態，屏幕內容也是一片空白。

自從采用超文本作為Web傳輸和呈現之后，我們都是采用這么一套傳輸方式。當負載比較小的時候，這并不會體現出有什么不妥?？墒钱斬撦d比較大，響應時間要很長，1分鐘、2分鐘……數分鐘的時候，這種等待就不可忍受了。嚴重的，超過響應時間，服務器干脆告訴你頁面不可用。另外，某些時候，我只是想改變頁面一小部分的數據，那為什么我必須重新加載整個頁面呢？當軟件設計越來越講究人性化的時候，這么糟糕的用戶體驗簡直與這種原則背道而馳。為什么老是要讓用戶等待服務器取數據呢？至少，我們應該減少用戶等待的時間?，F在，除了程序設計、編碼優化和服務器調優之外，還可以采用AJAX。

2.3 為什么使用AJAX

與傳統的Web應用不同，AJAX采用異步交互過程。AJAX在用戶與服務器之間引入一個中間媒介，從而消除了網絡交互過程中的處理—等待—處理—等待缺點。用戶的瀏覽器在執行任務時即裝載了AJAX引擎。AJAX引擎用JavaScript語言編寫，通常藏在一個隱藏的框架中。它負責編譯用戶界面及與服務器之間的交互。AJAX引擎允許用戶與應用軟件之間的交互過程異步進行，獨立于用戶與網絡服務器間的交流?，F在，可以用JavaScript調用AJAX引擎來代替產生一個HTTP的用戶動作，內存中的數據編輯、頁面導航、數據校驗這些不需要重新載入整個頁面的需求可以交給AJAX來執行。

使用AJAX，可以為ISP、開發人員、終端用戶帶來可見的便捷：

減輕服務器的負擔：AJAX的原則是“按需取數據”，可以最大程度的減少冗余請求，和響應對服務器造成的負擔。

無刷新更新頁面，減少用戶心理和實際的等待時間。特別的，當要讀取大量的數據的時候，不用像Reload那樣出現白屏的情況，AJAX使用XMLHTTP對象發送請求并得到服務器響應，在不重新載入整個頁面的情況下用JavaScript操作DOM最終更新頁面。所以在讀取數據的過程中，用戶所面對的不是白屏，是原來的頁面內容（也可以加一個Loading的提示框讓用戶知道處于讀取數據過程），只有當數據接收完畢之后才更新相應部分的內容。這種更新是瞬間的，用戶幾乎感覺不到。 從而給用戶帶來了更好的體驗。

可以把以前一些服務器負擔的工作轉嫁到客戶端，利用客戶端閑置的能力來處理，減輕服務器和帶寬的負擔，節約空間和寬帶租用成本。

可以調用外部數據。 基于標準化的并被廣泛支持的技術，不需要下載插件或者小程序。 進一步促進頁面呈現和數據的分離。

3 Flapjax語言

3.1 Flapjax 是一種語言

Flapjax 的作者和它的主頁都強調 Flapjax 是一種語言。它的語法正好與 JavaScript 相同，而且第一個實現在下面提到的幾個方面與 JavaScript 相關聯，但是它的創建者關注的是編程語言理論。他們把 Flapjax 歸類為 “函數反應式（functional reactive）” 語言，它支持函數式編程以及聲明式和命令式編程。因此，除了 Ajax 開發人員之外，Flapjax 也引起了語言研究人員的興趣。

Flapjax 主要幫助您定義和表達 “反應” —— 即輸入（比如用戶鼠標移動和選擇等）和輸出（比如瀏覽器窗口中的視圖）之間的關系。同時，Flapjax 與現有的 JavaScript 兼容。它依賴于 JavaScript 已經使用的 DHTML和CSS（ Cascading style Sheet），當前沒有添加任何新的可見元素。從這個角度來看，Flapjax 是純粹算法性的，沒有添加任何 “可見的東西” —— 它僅僅使您已經了解的部件更容易編寫。

3.2 Flapjax 實現持久化

Flapjax不僅改進了傳統Ajax 的表達方式， 還實現了 Ajax 程序通常沒有實現的一些功能。其中比較重要的一項就是服務器端持久化，這在協作型應用程序中非常重要。Flapjax 簡化了從瀏覽器（web 客戶機）獲得信息并存儲回服務器的過程。在服務器端存儲數據之后，數據就可供任何客戶機使用。這樣就允許一個團隊一起處理一個文檔 —— 文檔的文本僅僅是一個持久性的 Flapjax 變量。

這意味著 Flapjax 是一種 Model-View-Controller（MVC）實現，應用程序開發人員很容易掌握它！MVC 通常要求在控制器中仔細地編寫正確的邏輯，但是 Flapjax “免費” 提供了控制器邏輯（參見官方教程）。應用程序開發人員可以把更多的精力投入到表示層的設計中去。

服務器端持久化需要進行 web 服務器配置。關于服務器配置的細節，可以參考 Flapjax 官方網站（www.Flapjax-lang.org）上的介紹。

3.3 Flapjax 應用實例

我們通過使用Flapjax實現一個簡單的數字時鐘（time1.fj）。如圖1所示，這是Flapjax的在線編譯器，在左邊的文本區域中輸入程序源代碼，確保您的瀏覽器支持 JavaScript。按 Compile and Run。你看到的不僅僅是當前的系統時間， 而是時間快速的增長著（單位為毫秒）。

仔細看代碼中有一句