Javascript framework（框架）資源整理

整理 ： Fred Wang 2012/1/8

依據Google搜尋統計的十大流行的javascript framework如下

• jQuery, jQuery UI ： Write Less, Do More，擁有相當多插件（Plug-in)和擴展的 JavaScript 程式庫，被上百萬的網站使用，包括 Google, Dell, CBS, NBC, DIGG, Bank of America, Wordpress, Drupal, Mozilla 等著名網站。
• Mootools ：不提供UI元件, 使用者經驗增強功能包含在MooTools.More.js, 這個擴展不僅僅是簡單的 UX/UI 插件，還包含對 Array、Date、Hash 和 String Class等附加功能。MooTools.More.js 包含拖放及一些效果。還包括一些 UI 控制，如 accordion、可排序的 HTML 表、scroller、工具提示和 Ajax spinner overlays。完全免費（MIT License), 使用網站包含W3C,CNet, Bing等，動畫效果平順。但插件較少。
• Prototype ：不提供UI元件與使用者經驗增強功能，但是被其他框架作為擴展使用。使用網站包含NASA, CNN, NBC等，適合大型網頁應用。插件超過150個。
• Dojo Toolkit ：Dojo 的核心小巧，快速，可用來建立反應靈敏的 Web 程式，擁有很出色的 UI 工具(dijit)，在可存取性，區域化也做得很好。支援客戶端資料儲存，Server端資料儲存與非同步通訊等 。dojox支援chating, grid與DTL(Dango template language),使用網站包含AOL, IBM, Sun等。

• Script.aculo.us ：是一個open source JavaScript程式庫，為Prototype的延伸，增加視覺效果和 UI行為控制包括 highlighting、morphing、folding、shaking、sliding、puffing 等等。Script.aculo.us 還提供拖放支持，例如滑塊、in-place Ajax 編輯器和 autocompleters。此外還有Windows Media 和 Real Media 播放器檢查等。使用網站包含Gucci,Feedburner,Ruby on Rails 等，最新版是Scripty2
• ExtJs(Sencha.com) ：是一個很出色的跨瀏覽器 JavaScript 框架，包含大量的UI組件，支援內聯編輯(Inline editing)、分頁、篩選、分組、彙總、緩衝和資料綁定。其他小組件包括選項卡、圖表、對話框、樹、外觀管理器、強化的表單控制元件、工具欄和選單、拖放和直接遠程功能（direct remoting）等,可以用來建立Rich Web 應用。
• Uize ：是一個open source Javascript框架，可以容易地更換skin,有大量的預設裝飾元件，令人眩目的效果與強大的功能。
• YUI Library (Yahoo)：規模最宏大的 JavaScript 程式庫，擁有數不清的強大功能，插件以及擴展，當然要掌握它也需要很長時間。 使用網站包含Yahoo, Linkedin, Wikia, NewsVine等
• Arcjetype : 與Prototype有很多共同點。一個獨立的管理系統，能夠只初始化頁面需要的組件。而且Archetype強調程式碼易讀性，和HTML/CSS/JavaScript分離的最佳方法。使用網站包含GifTeer, Meteo France等
• qooxdoo ：包含跨平台開發工具，完整的 GUI 工具以及高層客戶端服務器通訊層，（ LGPL/EPL Open Source ）支援拖放操作。

其他還有Cappuccino, Glow(BBC), GWT(Google) ,  Mochikit, Rialto, Rico(for RIA), Sproutcore, Spry(Adobe), moo.fx, DHTMLX, Echo Web framework,  ZK framework, Wijmo, Vaadin,  Alloy UI(Liferay), JxLib, MochaUI, MoolegoUI, jQuery Tools, KendoUI, Uki, Smartclient, Javascriptmvc, Midori, treesaver,  Raphael, SnackJS, FuseJS, Modernizr, Ample SDK, LivePipe UI, yepnope.js, heatmap.js, FitText, Ligature.js, njf,  Vanilla…

這些框架可能是從其他框架衍生而來的，如JxLib, MochaUI, MoolegoUI是基於Mootools所建立的。Wijmo, jQuery Tools, KendoUI, Dave.js是基於jQuery所建立的。Alloy UI是基於YUI所建立的。LivePipe UI是基於Prototype所建立的
用於視覺顯示,模擬,影像處理用的javascript framework有Processing.js, Pixastic,
手機/行動設備網頁應用系統javascript framework整理請見本blog另一篇文章
下面介紹一些小型的，特殊用途的javascript libraries/frameworks:
1.LivePipe UI : 以Prototype Javascript Framework為基礎的一套高品質的Web 2.0應用系統widgets與controls的小型套件。完全免費（MIT License).例如許多高品質，可以提高使用者經驗的元件，包含類型如Tabs, Windows, TextArea, SelectMultiple, Rating, ProgressBar, ScrollBar, ContextMenu。值得推薦。
2.Modernizr的是一個幫助舊版瀏覽器像最新版的工作一樣好的腳本，所以你可以構建將工作於IE6和7上的新應用程序。保證你的客戶一定會兼容它。
3.FitText是一個小型Javascript工具，允許根據父元素的大小自動調整大小的文字。
4.Ligature.js是一個小型Javascript工具，可以在網頁內文增加各種漂亮的連筆字。
5.YepNope.js是一個能夠根據使用者輸入條件來非同步選擇性資源載入js的工具程式，可以在頁面上僅載入用戶需要的js/css。
6.Diva.js一個以jQuery為基礎的Javascript的前端工具，用於瀏覽文件，呈現將多頁的文件以單頁連續項目顯示。
7.heatmap.js:可以根據你的資料用html5 canvas元素產生網頁熱圖(heatmap)。
8.njf : 一個超輕量級的 javascript 框架, 約 10K 大小，包含標籤控制、模板、表單、AJAX、長連接、拖曳、動畫、對話框等功能器。
9.TreeSaver : 用javascript 和 CSS和HTML 來達到雜誌呈現的效果,例如http://demo.nomadeditions.com/real-eats/, http://www.publicintegrity.org/treesaver/tuna/ 這兩個網站
（將持續增加介紹內容…)
參考資料

1. Wikipedia, Comparison of JavaScript frameworks
2. Superdit.com, 10 Javascript Framework With Rich UI Component
3. Web Designish, 14 Best JavaScript Framework
4. Boutros AbiChedid, 17 best free JavaScript frameworks and libraries
5. 小型javascript libraries/frameworks, Microjs
6. 10個對JavaScript開發者超級有用的工具
7. Google 排名中最紅的10套 JavaScript 框架
8. IBM, JavaScript 框架比較

Blog其他相關文章

1. 手機/行動設備網頁應用系統程式庫與框架(Phone web application system frameworks)