八款Js框架介绍及比较,Dojo 、Scriptaculous 、Prototype 、yui-ext 、Jquery 、Mochikit、mootools 、moo.fx，componentartui
Extjs 与 JQuery
1.Turbomail(www.turbomail.org)下一版本决定用Extjs + jquery 开发。
2.JQuery 提供了方便的对网页元素操作方法，但不提供基本控件,如：Tab，Grid，Muen 等，Extjs 是一套 完整的控件库，Extjs 提供这些控件。
3.Extjs 对制作控件的方法就是使用div 画格子，这点类似当年我写 windows 基本控件使用的方法。所以说 通过 js 完全可实现windows 界面。
4.Extjs 也提供JQuery 所包含的功能
5.Extjs 库体积大，JQuery 体积小，这是因为JQuery 只提供了网页元素操作方法，不提供控件，不过如果你 自己开发一套具有Extjs 这样完整的控件库，体积肯定不比Extjs 小
6.Extjs 和 JQuery 的源代码都写得很好，很值得一看。
八款Js框架介绍及比较 收藏
Posted on 2008-05-10 22:53 上校 阅读(3626) 评论(4) 编辑 收藏 网摘 所属分类: JavaScript
目前来看，JS框架以及一些开发包和库类有如下几个，Dojo 、Scriptaculous 、Prototype 、yui-ext 、Jquery 、Mochikit、mootools 、moo.fx
Dojo （JS library and UI component ）：
Dojo 是目前最为强大的j s框架，它在自己的Wiki上给自己下了一个定义，dojo是一个用JavaScript编写的开源的DHTML工具箱。dojo很想做一个“大一统”的 工具箱，不仅仅是浏览器层面的，野心还是很大的。Dojo包括ajax, browser, event, widget等跨浏览器API，包括了JS本身的语言扩展，以及各个方面的工具类库，和比较完善的UI组件库，也被广泛应用在很多项目中，他的UI组件的 特点是通过给html标签增加tag的方式进行扩展，而不是通过写JS来生成，dojo的API模仿Java类库的组织方式。 用dojo写Web OS可谓非常方便。dojo现在已经4.0了，dojo强大的地方在于界面和特效的封装，可以让开发者快速构建一些兼容标准的界面。
优点：库相当完善，发展时间也比较长，功能强大，据说利用dojo的io.bind()可以实现comet，看见其功能强大非一般，得到IBM和SUN的支持
缺点：文件体积比较大，200多KB，初次下载相当慢，此外，dojo的类库使用显得不是那么易用，j s语法增强方面不如prototype。
Prototype （JS OO library）：
是一个非常优雅的JS库，定义了JS的面向对象扩展，DOM操作API，事件等等， 以prototype为核心，形成了一个外围的各种各样 的JS扩展库，是相当有前途的JS底层框架，值得推荐，感觉也是现实中应用最广的库类（RoR集成的AJAX JS库），之上还有 Scriptaculous 实现一些JS组件功能和效果。
优点：基本底层，易学易用，甚至是其他一些js特效开发包的底层，体积算是最小的了。
缺点：如果说缺点，可能就是功能是他的弱项
Scriptaculous （JS UI component based on prototype）：
Scriptaculous是 基于prototype.js框架的JS效果。包含了6个js文件，不同的文件对应不同的js效果，所以说，如果底层用 prototype的话，做js效果用Scriptaculous那是再合适不过的了，连大名鼎鼎的digg都在用他，可见不一般
优点：基于prototype是最大的优点，由于使用prototype的广泛性，无疑对用户书锦上添花，并且在《ajax in action》中就拿Scriptaculous来讲述js效果
缺点：刚刚兴起，需要时间的磨练
yui-ext (JS UI component)：
基于Yahoo UI的扩展包yui-ext是具有CS风格的Web用户界面组件能实现复杂的Layout布局，界面效果可以和backbase媲美，而且使用纯 javascript代码开发。真正的可编辑的表格Edit Grid，支持XML和Json数据类型，直接可以迁入grid。许多组件实现了对数据源的支持，例如动态的布局，可编辑的表格控件，动态加载的Tree 控件、动态拖拽效果等等。1.0 beta版开始同Jquery合作，推出基于jQuery的Ext 1.0，提供了更多有趣的功能。
优点：结构化，类似于java的结构，清晰明了，底层用到了Jquery的一些函数，使整合使用有了选择，最重要的一点是界面太让让人震撼了。
缺点：太过复杂，整个界面的构造过于复杂。
Jquery ：
jQuery是一款同prototype一样优秀js开发库类，特别是对css和XPath的支持，使我们写js变得更加方便！如果你不是个js高手又想写出优 秀的js效果，jQuery可以帮你达到目的！并且简介的语法和高的效率一直是jQuery追求的目标，
优点：注重简介和高效，js效果有yui-ext的选择，因为yui-ext 重用了很多jQuery的函数
缺点：据说太嫩，历史不悠久。
Mochikit ：
MochiKit自称为一个轻量级的js框架。MochiKit 主要受到 Python 和 Python 标准库提供的很多便利之处的启发，另外还缓解了浏览器版本之间的不一致性。其中的 MochiKit.DOM 尤其方便，能够以比原始 JavaScript 更友好的方式处理 DOM 对象。MochiKit.DOM 大部分都是针对 XHTML 文档定制的，如果与 MochiKit 和 Ajax 结合在一起，使用 XHTML 包装的微格式尤其方便。Mochikit可以直接对字符串或者数字格式化输出，比较实用和方便。它还有自己的 js 代码解释器
优点：MochiKit.DOM这部分很实用，简介也是很突出的
缺点：轻量级的缺点
mootools ：
MooTools是一个简洁，模块化，面向对象的JavaScript框架。它能够帮助你更快，更简单地编写可扩展和 兼容性强的JavaScript代码。Mootools跟prototypejs相类似，语法几乎一样。但它提供的功能要比prototypejs多，而 且更强大。比如增加了动画特效、拖放操作等等。
优点：可以定制自己所需要的功能，可以说是prototypejs的增强版。
缺点：不大不小，具体应用具体分析
moo.fx ：
moo.fx 是一个超级轻量级的javascript特效库（7k）,能够与prototype.js或mootools框架一起使用。它非常快、易于使用、跨浏览 器、符合标准，提供控制和修改任何HTML元素的CSS属性，包括颜色。它内置检查器能够防止用户通过多次或疯狂点击来破坏效果。moo.fx整体采用模 块化设计，所以可以在它的基础上开发你需要的任何特效。
优点：小块头有大能耐
缺点：这么小了，已经不错了
要回答这个问题，我们对大约200个美国主流网站进行了调研，检查他们是否使用了JavaScript框架?如果使用，那么他们选用什么样的框架？ 在这里，我们选择检测的网站均源自于Alexa美国网站排名前100名和WebWare前100个WEB应用程式。而我们所检测的JavaScript框 架包括： Prototype, JQuery, MooTools, Yahoo! UI Library, Dojo, ExtJS 以及 MochiKit。
我们很快就发现， Dojo, ExtJS和MochiKit基本不被这些主流网站所采用。于是，我们就将目光锁定到了剩下的4款JavaScript框架上。
Prototype
Prototype是早期的JavaScript框架之一，而它也同时被应用到了Ruby on Rails框架之中。在所有检测的200个网站中，有13个网站采用Prototype作为其开发框架，包括：
CNN
The New York Times
Digg
Apple
Veoh.com
TypePad
Fox News Channel
Finetune
iLike
Last.fm
Twitter
Hakia
YouSendIt
JQuery
Jquery框架因其库文件大小，速度以及丰富的模式化操作所带来的海量插件库，目前引起了大家广泛的关注。在所有检测的网站中，有11个网站采用Jquery框架作为其开发框架，这包括：
Digg
BBC
Major League Baseball
Dell
IsoHunt
Break.com
TinyPic
FixMyMovie
eMusic
Kayak
Box.net
MooTools
与其他很多框架类似，Mootools包含了大量的函数和方法来协助其开发与拓展，这里面最著名的莫过于advanced effects组件了（advanced effects component）。在所有检测的网站中，有4个网站采用了MooTools:
Mint
Worth1000
Bebo
Vimeo
Yahoo! UI Library (YUI)
这是一套Yahoo（雅虎）自行开发的JavaScript框架。雅虎不仅将其作为自己所属网站的JS开放框架，而且免费提供给其他人自由使用。在所有检测的网站中，有7个网站采用了 Yahoo! UI Library:
Yahoo! Shopping
Zillow
Bebo
YouSendIt
ImageShack
LinkedIn
Walmart.com
那些我们无法确定使用框架的网站
在检测的网站中，有不少网站采用了不止一个JavaScript框架，而是多个组合使用。而这就导致，用户必须不得不被迫下载所有这些框架库，但所用到的功能仅仅是这些框架的部分功能。这种情况无疑是可以避免的。
这部分网站将多种框架组合使用，可能是考虑希望使用每个框架中最精华的部分，也可能是在项目中期临时换掉了项目开始时所确定的那个JavaScript框架，他们还却没有来得及将所有代码进行整合统一。
这些使用多个JS框架的网站是：Digg (Prototype和JQuery), Bebo (MooTools和YUI) 以及YouSendIt (Prototype和YUI)。
总结
在本次检测中，Prototype似乎是最受主流网站欢迎的JS框架，而JQuery紧随其后。有趣的是，我们也看到有多个网站采用 Yahoo! UI Library框架作为他们的JS框架，这与我们当初的想象是有一定差距的。
本次对这些主流网站的JS框架检查，可能不是百分之百的真实的，因为我们仅仅检测了他们的网站首页上所使用的框架。并且，我们也没有注册登录这些网站进行检查，所有在数据上可能存在一定的漏洞。
我们是如何做检测的？
首先，我们列出Alexa上美国网站前100名和WebWare前100个应用程式；然后，我们利用一个特殊的小工具进行关键字检查以确定其网站使用的JavaScript框架。
比如，对于Prototype来说，我们会搜索“prototype.js” 和 “/prototype”字符串以确定网站是否使用prototype或它的修改版本（除非所有的类似“prototype”都被替换去除掉了）。
当然，我们也会手工查看工具所检查出的这些网站所使用的框架是否与实际相符。比如，我们就去除掉了那些仅适用了雅虎的CSS框架，而非JavaScript框架的网站。
推荐一个不错的javascript框架——Mootools
作者：青蛙
目前网上有很多JS的框架，有美观的，有易用的，有灵活的，这些无非是让用户使用JS时更加的顺手。因此，对于没有自己写JS习惯的人来说，可能接触最多的就是目前比较常用且简单的几个框架，如：ExtJS（前身为YUI），JQuery。
对于经常自己写JS的人说，可能有时会接触这些框架，但高深的运用，用得比较多的我想应当是prototype框架，相对来说较成熟的底层，扩展性也不错。
但我们今天推荐的不是以上这几个，而是另外一个灵活且强大的底层JS框架，主要是针对有能力自己开发JS扩展的人员。
Mootools，当仁不让！当然，相信应当有不少人听过这个框架的名称。
在推荐这个框架之前先说说前面几种框架的大多使用场合，这样才有一个比较好的对比。
ExtJS，前身为YUI，由Yahoo开发的一套UI JS框架，或者叫组件更合适。对界面元素，特别是表单元素的细节及样式处理得十分炫丽。在多数的场合里，该框架担当着界面美化师的角色，为平淡无奇的 HTML表单元素提供了华丽的外衣。因此，它的主要用途应当是用在WEB Apps的美化工作，对于WEB页面使用较少。如果真要说优缺点的话，那这个框架的优点就是美观；缺点就是使用范围太小，从而限制了它的用途。
JQuery，应当是目前网络中使用得最多的框架。由于本身就是为了易用为出发点而设计，因此大多数的方法都是可以即时实现需要的效果。因此，不管 是JS的初学者还是高手，只要知道使用方法如何调用及设置，就可以很方便地实现很多很酷很炫的效果。该框架目前已具备较完善的方法集合，如TAB标 签，SlideBar及目前炒得火热的Ajax。但该框架有相对较完善的效果注定了这个框架的庞大，易于使用就注定了方法的定形，另外可扩展性不高；虽然 有着种种不如人意的地方，但确实给在JS方面云里雾里的用户提供了强大的技术支持。
Prototype，曾经一时的火热，目前不知道情况如何。它的出现，为开发人员提供了一个良好的协作环境，可以基于共同的底层实现方法的扩展，自 由度及灵活性得到不小的提高。但底层方法较死板，相对限制较多，但总体来说，它解决了上两种框架的无法自定义扩展的问题。缺点就是对JS技能有要求，想实 现一些效果需要自己码代码。
现在重点讲讲这个Mootools的框架，就青蛙个人而言，就目前为止还没碰过这么灵活的框架。
Mootools为mad4milk团队开发的JS框架，力求以最少的代码实现最灵活的底层，很明显，他们的目标就是这个。从参考文档来看，核心的 方法就只有几个，包括Core类包，Class类包及Element类包，但已包括多个应用场合，如浏览器的Browser，本地的Natives，必须 的Utlities及请求的Request等，另外还附带了一些简单的动画效果，如Fx的Tween，Transtions，CSS等，可见框架的涉及面 广。
除了框架核心代码量少外，Mootools还有一个对有OOP代码的用户来说很容易上手的功能，事实上，使用Mootools的要求就是用户也要有 OOP能力。在Mootools里有着OOP的继承，实现接口等，甚至引入了命名空间的概念；与传统的OOP比起来，它的写法有些不一样，但又十分相似， 比如接口的一种写法：
var newClass = new Class({initialize : function(){ //todo } }); //创建类
newClass. implement (//接口实现的方法); //对象实现接口与Java或者C#之类的public class newClass implements IFace{}写法比起来，是不是很像？
如果没接触过传统的OOP写法也没关系，依靠JS本身的写法写继承及实现接口也可以，如：
var iface = new Class({ //接口实现 });
var newClass = new Class({ implements:iface, initialize:function(){ //todo...} });一样也很方便，可见在编码习惯这方面，Mootools处理得还是不错的，让不同的使用者能保持自己的编码风格。
当然，这些仅是刚开始，利用这个框架开始编码的开始，具体的有哪些扩展及写法，不同的组合自然有不同的效果，篇幅有限这里不多做说明。
说了它这么多的优点，对于缺点我想大家也应当自己总结出来了，就是对使用者技能要求较高，最起码得了解JS的OOP写法。如果只是普通的运用，这个框架有点像"杀鸡用牛刀"的感觉了。不过，仁者见仁，智者见智吧。
如果你会自己写JS，如果你想用框架写JS的高级扩展，如果你想让自己的JS水平更上一层楼，建议你试试这个Mootools，应当不会让你失望的。
流行的AJAX框架对比：jQuery，Mootools，Dojo，Ext JS
2009-07-31 17:40
AJAX 是web20 的基石，现在网上流行几种开源的AJAX框架，比如：jQuery,Mootools,Dojo,Ext JS等等，那么我们到底在什么情况下该使用那个框架？以下是一组摘抄的数据：
Ajaxian在2007年底对Ajax工具进行了调查，部分调查结果见下表（其中数字为调查者使用该工具的百分比，详细的请参见网页）：http://ajaxian.com/archives/2007-ajax-tools-usage-survey-results
Prototype | jQuery | Ext | Script.aculo.us | Mootools | YUI | JSON | Dojo | Backbase |
34.1% | 29.3% | 22.5% | 22.3% | 14.3% | 13% | 12.9% | 11.8% | 8.3% |
其中Prototype使用率最高，很大程度上是因为它是最早成熟的框架，很多以前在项目中采用，所以现在一直在用
让我们来看看选择AJAX框架的基础：
你的项目需求（即你需要哪些特性，例如是否要求做出精美的界面、特效或其它功能）
是否支持A等级的浏览器（IE, Firefox等）?
文档的质量：是否完善（包含教程，API，代码示例等）
框架的可扩展性如何？为框架写插件容易吗？
你是否喜欢它的API的风格？
能大多程度上统一你的JavaScript代码的风格？
框架大小（太大的框架导致用户下载时间的延长）
框架是否强迫你改变写HTML的方式（Dojo就是这样）？
代码执行速度：性能如何？
代码是否为模块化（Mootools为高度模块化）？代码可重用性如何？
一、jQuery
设计思想
简洁的思想：几乎所有操作都是以选择DOM元素（有强大的Selector）开始，然后是对其的操作（Chaining等特性）。
优点
小，压缩后代码只有20多k（无压缩代码94k）。
Selector和DOM操作的方便：jQuery的Selector与mootools的Element.Selectors.js比较，CSS Selector, XPath Selector（1.2后已删除）
Chaining：总是返回一个jQuery对象，可以连续操作。
文档的完整，易用性（每个API都有完整的例子，这是其它框架现在不能比的），而且网上还有很多其它的文档，书籍。
应用的广泛，包括google code也使用了jQuery。
使用jQuery的站点：http://docs.jquery.com/Sites_Using_jQuery
核心的开发团队和核心人员：John Resig等。
简洁和简短的语法，容易记。
可扩展性：有大量用户开发的插件可供使用（http://jquery.com/plugins/ ）
jQuery UI（http://jquery.com/plugins/ ，基于jQuery，但和核心的jQuery是独立的），不断发展中。
友好和活跃的社区：google groups: http://docs.jquery.com/Discussion
事件处理有很多方便的方法，如click，而不是单一的addEvent之类的。
缺点
由于设计思想是追求高效和简洁，没有面向对象的扩展。设计思路和Mootools不一样。
CSS Selector的速度稍微有些慢（但是现在速度已经大幅提高）
Mootools
设计思想
面向对象的设计思想。
优点
模块化，各模块代码非常独立，最小的核心只有8k，最大的优点是可选择使用哪些模块，用的时候只导入使用的模块即可，完整的也不到180k（没有压缩），压缩后不到70k。
语法的简洁，直观。
特效（Effects）：这一点比jQuery稍强，现在也正在开发Mootools UI（这应该是Ajax框架开发的一个趋势）。
代码写的优美，易阅读和修改。
文档的完整（最新的1.2beta的文档比以前更详细）。
活跃的社区：官网(http://forum.mootools.net/ )，还有一个IRC。
性能：见：http://mootools.net/slickspeed/
缺点
修改了低层的一些类：如Array, String等，这也是设计思想的不同。
在DOM和CSS Selector上不如jQuery强大。
Dojo
优点
背后强大的支持：IBM、Sun、BEA等，这是非常重要的优势。
功能的强大，Full Stack的框架，扩展了DHTML的能力，例如：
支持与浏览器Back/Forward按钮的集成。
Dojo Offline，一个跨平台的离线存储API。
Chart组件，可以方便地在浏览器端生成图表。
基于SVG/VML的矢量图形库。
Google Maps、Yahoo! Maps组件，方便开发Mashup应用。
Comet支持，通过通用的Buyeux协议。
强大的UI（Dijit）。
面向对象的设计，统一的命名空间，包管理机制（The Package System and Custom Builds）
可扩展性。
缺点
复杂，学习曲线陡。
文档的极端不全，这是一个很大的问题。
API很多不稳定，各版本间改动较大，现在还不是一个成熟的框架。
侵入性太大，页面中大量使用dojo的属性，例如<button dojoType="dijit.form.Button" id="helloButton">，如果将来dojo升级或者换一个框架时，负担会很大。
性能问题，由于dojo加载采用了同步的机制，会暂时锁定浏览器，导致CPU使用率达到100%。另外，很多Widget的速度很慢。
Ext JS
设计思想
组件化，推进RIA（Rich Internet Application）的应用。
优点
强大的UI，而且性能不错，这是其最大的优点。
速度快，管是UI还是其它模块。
100%面向对象和组件化的思想，一致的语法，全局的命名空间。
文档的完整，规范，方便。
核心的开发团队，Jack Slocum等。
活跃的社区，迅速增加的用户量。
模块化实现，可扩展性强。
所有的组件（widgets）都可直接使用，而无需进行设置（当然，用户可以选择重新配置）。
缺点
稍复杂。
为重量级的框架（包含大量UI），体积大。如果导入ext-all.js，压缩后也有近500k。
注意：EXT的商业使用：如果只是把extjs包含在自己的项目中，而且这个项目不是卖给用户做二次开发的工具箱，或组件库，就可以遵守LGPL协议免费使用；否则要付费。
总结
轻量级选择
轻量级的选择：主要是mootools和jquery，由于它们的设计思想的不同，jQuery是追求简洁和高效，Mootools除了追求这些目 标以外，其核心在于面向对象，所以jQuery适合于快速开发，Mootools适合于稍大型和复杂的项目，其中需要面向对象的支持；另外，在Ajax的 支持上，jQuery稍强一些；在Comet的支持上，jQuery有相关的插件，Mootools目前没有，但是Comet的核心在于服务器的支持，浏 览器端的接口很简单，开发相关的插件很简单。
在面向对象的Javascript Library中，mootools逐渐战胜了prototype（体积大，面向对象的设计不合理等），也包括script.acul.ous（基于prototype，实际上就是prototype上的UI库）。
面向RIA的框架
考虑纯JavaScripty库，目前主要是Dojo和ExtJS（还有YUI）。Dojo更适合企业应用和产品开发的需要，因为离线存储、 DataGrid、2D、3D图形、Chart、Comet等组件对于企业应用来说都是很重要的（当然这些组件还要等一段时间才能稳定下来）。例 如，BEA基于Mashup技术开发的产品中已经使用了Dojo。
ExtJS：美观和"易用"，并且足够强大。在对UI有比较大的需求时，是首选。
