5個JAVASCRIPT架構詳細的比較

架構比較

表1對本文中討論的五個架構提供詳細的比較

	Prototype	jQuery	YUI	ExtJS	MooTools
Latest Version	1.6.1	1.4.1	3.00	3.1	1.2.4
License	MIT	MIT & GPL	BSD	Commercial & GPL v3	MIT
			Browser Compatibility
IE Support	6.0+	6.0+	6.0+	6.0+	6.0+
Firefox Support	1.5+	2.0+	3.0+	1.5+	2.0+
Safari Support	2.0.4+	3.0+	4.0+	3.0+	2.0+
Opera Support	9.25+	9.0+	10.0+	9.0+	9.0+
Chrome Support	1.0+	1.0+	Not verified	Not verified	Not verified
			Core Features
Ajax Support	Yes	Yes	Yes	Yes	Yes
DOM Manipulation	Yes	Yes	Yes	Yes	Yes
DOM Traversal	Yes	Yes	Yes	Yes	Yes
Event Handling	Yes	Yes	Yes	Yes	Yes
JSON	Yes	Yes	Yes	Yes	Yes
Selectors	Yes	Yes	Yes	Yes	Yes
			UX/UI Enhancements
Accordion	No	jQuery UI	No	Yes	MooTools More
Animation	scriptaculous	Yes	Yes	Yes	Yes
Auto Completion	scriptaculous	No	Yes	Yes	No
Browser History	scriptaculous	No	Yes	Yes	No
Calendar	No	jQuery UI	Yes	Yes	No
Charting	No	No	Yes	Yes	No
Drag and Drop	scriptaculous	jQuery UI	Yes	Yes	MooTools More
Grids	No	No	Yes	Yes	MooTools More
Progress Bar	No	jQuery UI	Yes	Yes	No
Resizing	No	jQuery UI	Yes	Yes	No
Rich Text Editor	No	No	Yes	Yes	No
Slider	scriptaculous	jQuery UI	Yes	Yes	MooTools More
Tabs	No	jQuery UI	Yes	Yes	No
Themes	No	jQuery UI	Yes	Yes	MooTools More
Tree Views	No	No	Yes	Yes	No

其他值得注意的架構

為了簡潔，本文只討論五個比較流行的架構，這並不意味著這是最流行的、最好的、功能最豐富的。

其它的一些架構也值得一提、值得一看。

• Cappuccino
• Dojo
• Glow
• GWT
• MochiKit
• Qooxdoo
• Rialto
• Rico
• SproutCore
• Spry
• UIZE

回顧

在本文中，你已經瞭解到JavaScript架構的概念，知道它在網站和網路應用發展中的好處。對這些架構的共同功能有一個總體描述，並用執行個體說明了它的應用。同時你也瞭解到五個架構的一個或一些使用者體驗和使用者介面。最後，你得到了一份直觀的表格，反白每個架構具有或不具有的特色。有了這些資訊，在為你或你的團隊作出明智選擇之前，你可以進一步研究這些架構。

資源

• (developerWorks, November 2005) explains how to
  build Ajax-based Web applications.
• Learn about Dojo.
• Read the articleDojo concepts for Java developers(developerWorks, October 2008) to bridge the gap from Java code to Dojo so that you can get up to speed quickly and use the toolkit when developing your applications.
• Read Call SOAP Web services with Ajax,
  Part 1: Build the Web services client
  (developerWorks, October 2005) to learn how to implement a Web browser-based
  SOAP Web services client using the Ajax design pattern.
• Overcome
  security threats for Ajax applications
  (developerWorks, June 2007) discusses the
  threats associated with Ajax technologies and gives you some best
  practices to avoid them.
• Mastering
  Ajax, Part 1: Introduction to Ajax
  (developerWorks, December 2005) explains how HTML,
  JavaScript, DHTML, and DOM work together to make extremely efficient Web
  development an easy reality.
• Simplify Ajax development with jQuery
  (developerWorks, April 2007) examines the jQuery
  philosophy, explains its features and functions, and gives you some common
  Ajax tasks.
• Using Ajax with DB2
  (developerWorks, August 2007) shows how the IBM Information
  on Demand 2006 Conference Personal Planner uses Ajax to work with
  DB2®.
• To listen to interesting interviews and
  discussions for software developers, check out developerWorks podcasts.
• developerWorks technical events and webcasts:
  Stay current with developerWorks technical events and webcasts.

獲得產品和技術

• Download the Dojo toolkit. Dojo toolkit.
• Get the Prototype Javascript framework.
• Get jQuery.
• The jQuery User Interface provides
  abstractions for low-level interaction and animation, advanced effects and
  high-level, themeable widgets, built on top of the jQuery JavaScript
  Library.
• Get script.aculo.us.
• Get MooTools.
• Download and
  learn about the Yahoo! YUI Library.
• Get ExtJS.
• Innovate your
  next open source development project with IBM trial software,
  available for download or on DVD.
• Download IBM product evaluation versions,
  and get your hands on application development tools and middleware
  products from DB2, Lotus®, Rational®, Tivoli®, and
  WebSphere®.

關於作者

Joe Lennon is a 24-year-old software developer from Cork, Ireland. Joe is author of the forthcoming Apress book Beginning CouchDB, and has contributed several technical articles and tutorials to IBM developerWorks. In his spare time, Joe likes to play football (soccer), tinker with gadgets and work on his Xbox 360 gamer score.

轉載地址：http://www.denisdeng.com/?p=736

原文地址：http://www.ibm.com/developerworks/web/library/wa-jsframeworks/index.html

摘要：現代網站和web應用程式趨向於依賴用戶端的大量的javascript來提供豐富的互動。特別是通過不重新整理頁面的非同步請求來返回資料或從伺服器端的指令碼（或資料系統）中得到響應。在這篇文章中，你將會瞭解到javascript架構如何更快、更方便的建立互動性強、響應快得網站和web應用程式。

導言：JavaScript是一種物件導向的指令碼語言，一直以來用作Web瀏覽器應用程式用戶端指令碼介面的選擇。JavaScript允許Web開發人員編程與網頁上的對象的工作,為憑空操作這些對象提供了一個平台。當JavaScript最初推出時，它通常用來提供一些微不足道的功能，如時鐘、在瀏覽器狀態列中滾動文本。另外一個常用特色就是“rollover link”,即當使用者的滑鼠滑過對象時，其文本的顏色或背景圖片發生改變。然而，近年來Ajax為網路編程帶來了全新的互動，JavaScript幾經發展變得更加有用。在Ajax之前，任何伺服器端處理或資料庫訪問都需要整頁面被“重新整理”或由瀏覽器呈現新的頁面。這不僅緩慢，令使用者失望，而且也浪費了頻寬和資源。

Ajax就是非同步JavaScript和XML，雖然引用XML不在有效，但是Ajax能對除了XMl的其它幾種格式的資料作出響應，如JSON(JavaScript對象標記法)。 Ajax的工作原理是，以非同步方式提交一個 HTTP請求提交到web伺服器，不重新整理也不呈現整個頁面，僅呈現響應的內容。相反，開發人員通常使用DOM（文件物件模型）操作修改網頁的一部分，HTTP響應返回的資料將反映這些改變。

什麼是JavaScript架構？

JavaScript本身是一種非常強大的語言，你不需要任何額外的架構就可以建立由它支援的富互連網應用系統（RIA）。但是，使用JavaScript並不是一件容易的事，主要是因為在試圖提供多種瀏覽器支援時各種併發症的出現。和HTML和CSS一樣，不同的瀏覽器的JavaScript執行方式不同，那麼確保您的JavaScript代碼跨瀏覽器安全色可以說是一個惡夢。

一個JavaScript架構或庫實際上是一系列工具和函數，它能更容易產生跨瀏覽器安全色的JavaScript代碼。每個庫在許多流行的最新版本的Web瀏覽器經過了嚴格測試。因此，您完全可以相信，使用這些架構中的任何一個，您的基於JavaScript的RIA在不同的瀏覽器和平台中將大體一致。

除了瀏覽器安全色性問題外，JavaScript架構可以更容易地編寫代碼去擷取、遍曆及操縱DOM元素。它們不僅能提供一個快捷的函數來擷取一個DOM元素的引用，而且還允許菊花式的DOM遍曆函數鏈尋找父母、子女或任何深度的兄弟節點元素。最後，架構提供了一系列的函數，使其更容易的操縱這些對象，允許其內容更改、添加、刪除，或者操縱class的樣式而影響元素的外觀。

JavaScript架構的另一個重要特色就是能更好的支援事件處理。由於瀏覽器之間的不同實現，跨瀏覽器事件處理可以說是一個惡夢。因此，JavaScript架構通常將瀏覽器事件封裝起來，並提供一系列有用的跨瀏覽器函數來處理它們。一些架構也提供了標準化的代表鍵盤鍵碼系列的事件（如Esc鍵、Enter鍵、游標等等）。

所有這些功能是非常有用的，JavaScript架構已在其最近流行Ajax應用中起重要作用。和JavaScript其他方面一樣，每個Web瀏覽器傾向於支援以不同的方式Ajax，使Ajax支援所有的瀏覽器將是很繁重的工作。幾乎所有的JavaScript架構都包括一定形式的Ajax庫，通常是提供Ajax請求和響應對象，在對響應作出評價後，更新DOM元素，輪詢一個特定的請求。

一個JavaScript架構的典型特徵

現在讓我們看看大多數JavaScript架構都具有的一些功能。這些特色有：

• 選取器
• DOM遍曆
• DOM操作
• 實用函數
• 事件處理
• Ajax

為了更好的詮釋這些特色，我將從下面一個或多個JavaScript架構中列舉一個例子：Prototype, jQuery， YUI，ExtJS和 MooTools。雖然每個架構的執行情況和文法不同，但其概念大致相同。每個架構有一個詳細的API參考，你可以參考它決定如何使用這些特定庫的特色功能。