本文主要选取了目前比较流行的JavaScript框架Dojo、Google Closure、jQuery、Prototype、Mootools和YUI进行对比,主要是根据网上的资料整理而成,希望可以供大家参考,如有错误欢迎指出:)

主流框架对比


Dojo(重量级框架)


Dojo是一个强大的面向对象JavaScript框架。主要由三大模块组成:Core、Dijit、DojoX。Core提供Ajax,events,packaging,CSS-based querying,animations,JSON等相关操作API。Dijit是一个可更换皮肤,基于模板的WEB UI控件库。DojoX包括一些创新/新颖的代码和控件:DateGrid,charts,离线应用,跨浏览器矢量绘图等。

优点:
1. 功能强大,组件丰富(包括图表支持)

2. 面向对象的设计,有统一的命名空间和包管理机制,适用于企业级或是复杂的大型Web应用开发
缺点:
1. 复杂,学习曲线陡

2. html中也需要涉及dojo属性,将来换框架的成本高,例如:

<button dojoType="dijit.form.Button" id="helloButton">

3. 性能问题,dojo加载采用了同步机制,会暂时锁定浏览器

Google Closure(重量级框架)


Google Closure Tools是Google内部使用的JavaScript开发工具,主要包括Closure Compile、Closure Inspector、Closure Linter、Closure Stylesheets、Closure Library和Closure Templates,这些工具都可以独立使用。

Closure Compile

Closure Compile是一个独立的JavaScript编译器,主要用于对JavaScript进行压缩,但它与其他压缩器如JSMin、YUI Compressor不同的是,它不仅仅是去除注释和空白,还可以在保证代码正确性的情况下进一步地改写成更省空间的做法,例如:

a = new Object => a = {}
a = new Array => a = []
if (a) b() => a && b()
return 2 * 3; => return 6;

经过测试,非Closure Library编写的JavaScript代码经过Closure Compile编译后可用。


Closure Inspector

Closure Inspector是应用于火狐浏览器的插件,可以与Firebug协同工作,对压缩后的代码进行调试,提供了源码匹配、改进的栈跟踪、单元测试集成功能。


Closure Templates

Closure Templates工具提供了一个在JavaScript中做模板的机制及函数库,可以把HTML布局的部分写成一个模版,接着再利用Closure提供的工具把这个模板编译成JavaScript代码,这样可以省去很多处理页面的工作。Closure Templates既可以生成JavaScript,又可以实现Java,所以可以在服务器和客户端使用相同的模板。


Closure Linter

Closure Linter是针对Google推出的JavaScript编码规范
Google JavaScript Style对JavaScript编码风格进行校验的工具,能很大程度上提升代码的可读性。


Closure Stylesheets

Closure Stylesheets是一个Java程序,它向CSS中添加了变量、函数、条件语句以及混合类型,使得我们更易于处理大型的CSS文件。开发者可以用它来生成web应用程序或者网站所使用的真正的CSS文件。详见
Google Closure Stylesheets让我们更易于使用CSS


Closure Library

Closure Library是一个面向对象,模块化,跨浏览器的JavaScript库,同时提供了大量的UI组件以及一些底层的应用如DOM操作、服务器交互、动画、数据结构、单元测试、富文本编辑等。
优点:

1. 功能强大,组件丰富,文档齐全,适用于对性能要求高的Web应用

2. 面向对象,在模块化、程序结构组织、逻辑封装等方面有优势

3. 使用Closure Compile能大程度的进行压缩和优化

缺点

1. 与Dojo复杂程度相当,框架庞大,学习曲线陡

2. 代码中存在一些漏洞,详见
Google Closure: 糟糕的JavaScript

3. 相比jQuery,维护的人员要少

Closure Lite

Closure Lite是利用Closure Compile对Closure Library的核心进行编译后生成的一个单独js文件,只有33k,引用起来很方便。但是它并没有解决Closure Library中所提到的缺点。

参考资料


jQuery(轻量级框架)


Jquery是轻量级的JavaScript库,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。

优点

1. 简洁易用,文档齐全

2. 有大量成熟的插件可供使用,扩展性强

3. 开发社区最大,维护的人员最多

缺点

1. 对面向对象没有很好的支持

2. 不能向后兼容,每一个新版本不能兼容早期的版本

3. 很多功能需要依赖于插件,然而插件太多,良莠不齐,不知道如何选择,且插件之间有可能会出现冲突


Prototype


Prototype是最早的JavaScript框架之一,目前已经很成熟了。它的强大之处主要在于它对DOM元素的扩展和处理跨浏览器事件,同时它对面向对象和简化AJAX的支持也很好。

优点

1. 对DOM和底层类的扩展使得在开发的时候增加了很多遍历

2. 有很多实用的函数

缺点

1. 由于扩展了底层类和DOM中的元素,可能存在一些潜在的冲突

2. 易用性不如jQuery


Mootools(轻量级框架)


Mootools是一个简洁,模块化,面向对象的JavaScript框架。它能够帮助你更快,更简单地编写可扩展和兼容性强的JavaScript代码。Mootools从Prototype.js中汲取了许多有益的设计理念,语法也和其极其类似。但它提供的功能要比Prototype.js多,整体设计也比Prototype.js要相对完善,功能更强大,比如增加了动画特效、拖放操作等。

优点

1. 功能强大,支持面向对象

2. 模块化,各模块代码非常独立,可以选择导入哪些模块

缺点

1. 对DOM和Selector的操作不如jQuery强大

2. 由于API设计上的不足,与Prototype类似,存在一些当下的和潜在的冲突,如修改了底层类以及其扩展DOM的方式

参考资料


YUI(重量级框架)


YUI由YAHOO官方团队开发,旨在构建一个富交互的Web应用程序函数库。它的全称是Yahoo UI,顾名思义,它提供了一套很强大的界面库,它能实现复杂的布局和很炫的界面效果。它由雅虎公司发布,与Google Closure类似,同时还提供了配套的压缩工具(YUI Compressor),文档生成工具(YUI Doc),单元测试工具(YUI Test)甚至开放了PHPLOADER(YUI PHP Loader )。

优点
1. 面向对象,功能强大

2. 提供了丰富的UI库

3. API标准化、规范的类结构、命名空间等,易于维护

缺点

1. 速度相对jQuery慢

2. 易用性不如jQuery


各框架具体参数对比


提供一个wiki上的参数对比:
Comparison of JavaScript frameworks


各框架对于移动平台的支持


以上框架中提供了移动平台的支持或插件的有Dojo、jQuery、Mootools和YUI。

Dojo提供了
Dojo Mobile,jQuery提供了
jQuery Mobile,Mootools提供了
Moobile,YUI提供了
Bottle


总结


以上各框架中,jQuery、Mootools属于轻量级框架,Prototype属于中型框架,而Dojo、Google Closure、YUI则属于重量级框架。重量级框架适合大型的web应用,前期开发成本高,但后期维护成本低。轻量级框架适合开发中小型应用。

重量级框架中,Dojo由于修改了html,后期如果更换框架成本会很高,不建议使用;Google Closure的Compile、Stylesheets、Linter虽然很强大,但是Library相比YUI还是稍逊一筹,因此建议使用YUI。

轻量级框架中,jQuery上手快,易用性强,但是不支持面向对象,且更多功能需要依赖插件来实现,适合快速开发;Mootools支持面向对象,而且模块化程度高,适合长期维护。

因此,可以结合项目的需求以及各JavaScript框架的特点来选择,不管使用何种框架,都可以附加使用一些工具,如使用Closure Linter来规范JS代码,使用Closure Compile来优化压缩JS代码,使用Closure Stylesheets来生成CSS文件,使用YUI Doc来生成API文档。


转载请注明出处,谢谢!

主流JavaScript框架(Dojo、Google Closure、jQuery、Prototype、Mootools和YUI)的分析和对比的更多相关文章

  1. javascript 框架、根基技巧、布局、CSS、控件 JavaScript 类库

    预筹备之 JavaScript 今朝支流的 JavaScript 框架排名中,jQuery 和 Ext 可算是佼佼者,得到了用户的普遍好评.海内的一些框架许多也是模仿 jQuery 对 JavaScr ...

  2. 20 个值得一试的JavaScript 框架

      投递人 itwriter 发布于 2011-09-26 17:46 评论(3) 有1956人阅读 原文链接 [收藏] « » 本文介绍 20 个值得一试的 JavaScript 框架,如果你认为答 ...

  3. 16 款最流行的 JavaScript 框架

    本文列举了16个当前最流行的JavaScript框架.在这个列表中,既包括jQuery和Mootools,也有Zepo移动JavaScript框架. 里面一定有你正在用的或想尝试用的JavaScrip ...

  4. 第一章 : javaScript框架分类及主要功能

      从内部架构和理念划分,目前JavaScript框架可以划分为5类. 第一种是以命名空间为导向的类库或框架,如果创建一个数组用new Array(),生成一个对象用new Object(),完全的j ...

  5. 16 款最流行的JavaScript 框架

    1. jQuery – Javascript框架 jQuery 是最流行的 JavaScript 框架,它简化了HTML 文档遍历.事件处理.动画和Ajax交互.jQuery插件非常之多. 2. Do ...

  6. 赶快收藏!16款最流行的 JavaScript 框架

    下面为大家介绍 16款最流行的 JavaScript 框架,赶快收藏! 1. jQuery – Javascript框架 jQuery 是最流行的 JavaScript 框架,它简化了HTML 文档遍 ...

  7. 前端必备,十大热门的 JavaScript 框架和库

    JavaScript 框架和库可以说是开源项目中最庞大也是最累的类目了,目前在github 上这一类的项目是最多的,并且几乎每隔一段时间就会出现一个新的项目席卷网络社区,虽然这样推动了创新的发展,但不 ...

  8. JavaScript 框架(库)

    JavaScript 高级程序设计(特别是对浏览器差异的复杂处理),通常很困难也很耗时. 为了应对这些调整,许多的 JavaScript (helper) 库应运而生. 这些 JavaScript 库 ...

  9. 2014年最火的 21个JavaScript 框架

    下面,我们将会介绍 2014 年最火的 21 款JavaScript 框架,专为前端开发者准备的哦:)众所周知, JavaScript 框架是 JavaScript编程语言最棒的特性之一. JavaS ...

随机推荐

  1. HDU 4336 Card Collector(动态规划-概率DP)

    Card Collector Problem Description In your childhood, do you crazy for collecting the beautiful card ...

  2. MSSQL - 尚未备份数据库 xxxx 的日志尾部。如果该日志包含您不希望丢失的工作,请使用 BACKUP LOG WITH NORECOVERY 备份该日志。请使用 RESTORE 语句的 WITH REPLA

    此错误的原因是:你的数据库服务器中存在同名数据库! RESTORE DATABASE  [student] FROM  DISK = N'G:\备份文件'  WITH  FILE = 1, MOVE ...

  3. HDU Wolf and Rabbit

    Description There is a hill with n holes around. The holes are signed from 0 to n-1. A rabbit must h ...

  4. Oracle、DB2、MySql、SQLServer JDBC驱动

    四种数据库JDBC驱动,还列出了连接的Class驱动名和Url Pattern,DB2包括Type 2.Type 3和Type 4三种模式.注意驱动包名称的大小写. Oralce连接驱动包名和URL ...

  5. [ACM] n划分数m部分,它要求每一个部分,并采取了最大的产品(间隔DP)

    A - 爱管闲事 春希很爱管闲事,他每天都会抽出时间帮助一些同学,因为春希很死板,出于公平性,春希不会先帮助后来找他的同学. 如今有n个同学须要他的帮助,尽管他非常想一天之类帮助全部人,但毕竟精力有限 ...

  6. CSS3实现8种Loading效果【第二波】

    原文:CSS3实现8种Loading效果[第二波] 今晚吃完饭回宿舍又捣鼓了另外几种Loading效果,老规矩,直接“上菜“…… 注:gif图片动画有些卡顿,非实际效果! PS:若要转载请注明出处,尊 ...

  7. Maven坐标 groupId artifactId version packaging classifier name

    groupId定义项目属于哪个组,这个组往往和项目所在的组织或公司存在关联.譬如在googlecode上建立一个名为myapp的项目,那么groupId就应该是com.googlecode.myapp ...

  8. UVA 10911 Forming Quiz Teams(dp + 集合最优配对问题)

    4th IIUC Inter-University Programming Contest, 2005 G Forming Quiz Teams Input: standard input Outpu ...

  9. Libgdx实现异步加载网络图片并保存到SD卡或者data/data目录下边

    Libgdx实现异步加载网络图片并保存到SD卡或者data/data目录下边,当本地有图片的时候,直接从本地读取图片,如果本地没有图片,将从服务器异步加载图片 package com.example. ...

  10. scrum经验

    Scrum是基于过程控制理论的经验方法,倡导自组织团队:其运行框架核心是迭代增量型并行开发,也是“适应性”的软件开发方法.Scrum提供了高度可视化的用于管理软件开发复杂性管理的敏捷项目管理的实践框架 ...