雖然Ajax所需的基礎架構已經出現了壹段時間,但直到最近異步請求的真正威力才得到利用。能夠擁有壹個響應極其靈敏的Web站點確實激動人心,因為它最終允許開發人員和設計人員使用標準的HTML/CSS/JavaScript堆棧創建“桌面風格的(desktop-like)”可用性。
通常,在J2EE中,開發人員過於關註服務和持久性層的開發,以至於用戶界面的可用性已經落後。在壹個典型的J2EE開發周期中,常常會聽到這樣的話,“我們沒有可投入UI的時間”或“不能用HTML實現”。但是,以下Web站點證明,這些理由再也站不住腳了:
BackPack
Google Suggest
Google Maps
PalmSphere
所有這些Web站點都告訴我們,Web應用程序不必完全依賴於從服務器重新載入頁面來向用戶呈現更改。壹切似乎就在瞬間發生。簡而言之,在涉及到用戶界面的響應靈敏度時,基準設得更高了。
定義Ajax
Adaptive Path公司的Jesse James Garrett這樣定義Ajax:
Ajax不是壹種技術。實際上,它由幾種蓬勃發展的技術以新的強大方式組合而成。Ajax包含:
基於XHTML和CSS標準的表示;
使用Document Object Model進行動態顯示和交互;
使用XMLHttpRequest與服務器進行異步通信;
使用JavaScript綁定壹切。
這非常好,但為什麽要以Ajax命名呢?其實術語Ajax是由Jesse James Garrett創造的,他說它是“Asynchronous JavaScript + XML的簡寫”。
Ajax的工作原理
Ajax的核心是JavaScript對象XmlHttpRequest。該對象在Internet Explorer 5中首次引入,它是壹種支持異步請求的技術。簡而言之,XmlHttpRequest使您可以使用JavaScript向服務器提出請求並處理響應,而不阻塞用戶。
在創建Web站點時,在客戶端執行屏幕更新為用戶提供了很大的靈活性。下面是使用Ajax可以完成的功能:
動態更新購物車的物品總數,無需用戶單擊Update並等待服務器重新發送整個頁面。
提升站點的性能,這是通過減少從服務器下載的數據量而實現的。例如,在Amazon的購物車頁面,當更新籃子中的壹項物品的數量時,會重新載入整個頁面,這必須下載32K的數據。如果使用Ajax計算新的總量,服務器只會返回新的總量值,因此所需的帶寬僅為原來的百分之壹。
消除了每次用戶輸入時的頁面刷新。例如,在Ajax中,如果用戶在分頁列表上單擊Next,則服務器數據只刷新列表而不是整個頁面。
直接編輯表格數據,而不是要求用戶導航到新的頁面來編輯數據。對於Ajax,當用戶單擊Edit時,可以將靜態表格刷新為內容可編輯的表格。用戶單擊Done之後,就可以發出壹個Ajax請求來更新服務器,並刷新表格,使其包含靜態、只讀的數據。
壹切皆有可能!但願它能夠激發您開始開發自己的基於Ajax的站點。然而,在開始之前,讓我們介紹壹個現有的Web站點,它遵循傳統的提交/等待/重新顯示的範例,我們還將討論Ajax如何提升用戶體驗。