论坛首页 Web前端技术论坛

认识Dojo中的界面控件:Dijit

浏览 26447 次
该帖已经被评为良好帖
作者 正文
   发表时间:2010-09-16  
clue 写道
dojotoolkit 写道
clue 写道
LZ能介绍下你用Dojo开发过的项目吗?
有没有用OPOA?

代码管理、重用方面怎么做的?


基本都是OPOA应用。Dojo的代码管理和Java的package机制几乎完全一样,每个package是一个文件夹,很容易管理。
代码重用更大程度取决于代码的模块化和抽象化程度。Dojo很好的面向对象机制让你容易做到模块化,但抽象化则更大程度上你们对程序的设计。

刚才看了下源码,Dojo貌似采用的是同步ajax来加载JS文件,然后每个子文件又可能有其它的依赖加载。
当模块依赖层次一多,这个加载时间就……
实际使用中你们有优化吗?
Ext中没有相关的代码,所以我们参照网上的各种实现,结合自己的框架做了个异步加载,体验性比同步加载应该要好不少。

还有,OPOA中有两个很严重的问题:内存泄漏与性能
ExtJS在3.1基本已经消灭了基础组件的内存泄漏,不知道Dojo在这方面做得怎么样?
性能方面,JS RIA最大的性能消耗还是在Dom操作上。在Ext中有一些针对性能问题而开发的第三方组件,比如大量数据的Grid,可以使用BufferView;CardLayout可以让未显示的组件暂时不创建Dom节点。Dojo这方面支持多么?(据网上很久前的一篇文章介绍,Dojo性能方面做得不够好)


有优化。所有正式发布的Dojo应用都要打一个Build,将这些小文件打成一个单独的较大的文件,从而能大大减少这方面的开销。ShrinkSafe,你可以查查这个。
Dojo强力的Grid组件,比如EnhancedGrid,支持延迟加载。
1 请登录后投票
   发表时间:2010-09-16  
elementstorm 写道
dojotoolkit 写道
witcheryne 写道
这篇文章很清晰!!非常感谢...

能不能介绍一下dojo和jquery在dom查询上的区别...

个人非常喜欢jquery的dom查询方式 不知道dojo和jquery上有什么区别

之前学了一段时间的YUI, 那个dom查询让人相当的崩溃,就是能比直接用dom api方便些


呵呵,dojo的query和jquery完全一样,都是基于css 3标准,例如:
dojo.query('div[attr=value]', node).

node参数表示在这个节点内查询。得到的结果是一个NodeList数组。

在这里有query性能的比较:http://mootools.net/slickspeed/,Dojo是最快的。


...大哥,我测试怎么dojo最慢呢
MooTools 1.2 JQuery 1.2.6 Prototype 1.6.0.2 YUI 2.5.2 Selector beta Dojo 1.1.1
     62                   41                  179                              196                        270

这个版本太老了,下面这个链接是比较新的版本
http://dante.dojotoolkit.org/taskspeed/
0 请登录后投票
   发表时间:2010-09-16  
elementstorm 写道
dojotoolkit 写道
witcheryne 写道
这篇文章很清晰!!非常感谢...

能不能介绍一下dojo和jquery在dom查询上的区别...

个人非常喜欢jquery的dom查询方式 不知道dojo和jquery上有什么区别

之前学了一段时间的YUI, 那个dom查询让人相当的崩溃,就是能比直接用dom api方便些


呵呵,dojo的query和jquery完全一样,都是基于css 3标准,例如:
dojo.query('div[attr=value]', node).

node参数表示在这个节点内查询。得到的结果是一个NodeList数组。

在这里有query性能的比较:http://mootools.net/slickspeed/,Dojo是最快的。


...大哥,我测试怎么dojo最慢呢
MooTools 1.2 JQuery 1.2.6 Prototype 1.6.0.2 YUI 2.5.2 Selector beta Dojo 1.1.1
     62                   41                  179                              196                        270

我这里测:
FF3.6
107 99 310 498 41
Chorme
64 45 225 184 46
IE6 (IE suck)
609   412   3089   1746   763 
0 请登录后投票
   发表时间:2010-09-16   最后修改:2010-09-16
EldonReturn 写道

有优化。所有正式发布的Dojo应用都要打一个Build,将这些小文件打成一个单独的较大的文件,从而能大大减少这方面的开销。ShrinkSafe,你可以查查这个。
Dojo强力的Grid组件,比如EnhancedGrid,支持延迟加载。

有的项目很大,是不可能所有文件都合并起来的(大于500个文件,总代码10W行以上)
ShrinkSafe查了下,是类似YUI compressor的压缩工具,但它对实际运行性能并无帮助,顶多优化初次下载速度,并稍微保护下代码。我们用的是google closure,效果还不错,比YUI的压缩率要高,并且还对中文进行了编码。

EnhancedGrid没看出什么头绪,呵呵……
ExtJS的实现倒不错,只用替换一下View模块就可以了,它实现的功能很简单,只渲染你能看到的数据的Dom节点。
0 请登录后投票
   发表时间:2010-09-16  
clue 写道
EldonReturn 写道

有优化。所有正式发布的Dojo应用都要打一个Build,将这些小文件打成一个单独的较大的文件,从而能大大减少这方面的开销。ShrinkSafe,你可以查查这个。
Dojo强力的Grid组件,比如EnhancedGrid,支持延迟加载。

有的项目很大,是不可能所有文件都合并起来的(大于500个文件,总代码10W行以上)
ShrinkSafe查了下,是类似YUI compressor的压缩工具,但它对实际运行性能并无帮助,顶多优化初次下载速度,并稍微保护下代码。我们用的是google closure,效果还不错,比YUI的压缩率要高,并且还对中文进行了编码。

EnhancedGrid没看出什么头绪,呵呵……
ExtJS的实现倒不错,只用替换一下View模块就可以了,它实现的功能很简单,只渲染你能看到的数据的Dom节点。

常用的做法是分模块,一个模块打一个build,这样会小很多,而且容易管理和维护。这个东西主要是合并和缩减文件大小(比如变量名缩减)用的,缩完了之后还可以用其它工具继续。
0 请登录后投票
   发表时间:2010-09-16  
elementstorm 写道
dojotoolkit 写道
witcheryne 写道
这篇文章很清晰!!非常感谢...

能不能介绍一下dojo和jquery在dom查询上的区别...

个人非常喜欢jquery的dom查询方式 不知道dojo和jquery上有什么区别

之前学了一段时间的YUI, 那个dom查询让人相当的崩溃,就是能比直接用dom api方便些


呵呵,dojo的query和jquery完全一样,都是基于css 3标准,例如:
dojo.query('div[attr=value]', node).

node参数表示在这个节点内查询。得到的结果是一个NodeList数组。

在这里有query性能的比较:http://mootools.net/slickspeed/,Dojo是最快的。


...大哥,我测试怎么dojo最慢呢
MooTools 1.2 JQuery 1.2.6 Prototype 1.6.0.2 YUI 2.5.2 Selector beta Dojo 1.1.1
     62                   41                  179                              196                        270


我这FF3.6:
final time (less is better)  39 36 123 143 20


突然发现其中竟然没有ExtJs,呵呵,看来国外还是喜欢open的东西多点
0 请登录后投票
   发表时间:2010-09-16  
clue 写道
EldonReturn 写道

有优化。所有正式发布的Dojo应用都要打一个Build,将这些小文件打成一个单独的较大的文件,从而能大大减少这方面的开销。ShrinkSafe,你可以查查这个。
Dojo强力的Grid组件,比如EnhancedGrid,支持延迟加载。

有的项目很大,是不可能所有文件都合并起来的(大于500个文件,总代码10W行以上)
ShrinkSafe查了下,是类似YUI compressor的压缩工具,但它对实际运行性能并无帮助,顶多优化初次下载速度,并稍微保护下代码。我们用的是google closure,效果还不错,比YUI的压缩率要高,并且还对中文进行了编码。

EnhancedGrid没看出什么头绪,呵呵……
ExtJS的实现倒不错,只用替换一下View模块就可以了,它实现的功能很简单,只渲染你能看到的数据的Dom节点。



Dojo的ShrinkSafe主要是可以用来打包,能理清各种require的关系,不用自己去指定打包顺序。

代码的异步加载确实是很重要的功能,可惜dojo现在还不支持。只能自己去实现。
但在OA应用中这其实问题不太大。只要代码性能好,初次加载时间长点不是大问题。google的gmail初次加载的js代码都有1MB之多,只是有了进度条让人不觉得时间太长。

而对于小型应用,代码量也不会太多,一次加载就可以了。
在早期的项目中,曾经用过异步加载代码,但现在用的很少了。
0 请登录后投票
   发表时间:2010-09-17  
看样子Dojo的自带加载机制只适用于小应用,复杂的应用考虑到效率还是要异步加载才行。
并且,Dojo的依赖只有加载后才知道,所以导致了串联加载。(可以使用静态依赖解决此类问题,一次性将所有依赖计算出来,同时并发请求)

这样看来几乎没什么框架能做到尽善尽美,很多时候框架只能给个高些的起点而已,更多的还是要看设计扩展能力。
0 请登录后投票
   发表时间:2010-09-17  
clue 写道
看样子Dojo的自带加载机制只适用于小应用,复杂的应用考虑到效率还是要异步加载才行。
并且,Dojo的依赖只有加载后才知道,所以导致了串联加载。(可以使用静态依赖解决此类问题,一次性将所有依赖计算出来,同时并发请求)

这样看来几乎没什么框架能做到尽善尽美,很多时候框架只能给个高些的起点而已,更多的还是要看设计扩展能力。


Release应用中不会有串联加载,因为build过程会把所有依赖关系的文件package成一个。
曾经也仔细思考了下为什么几乎所有著名框架都没有异步加载代码机制,难道那些人都这么笨么。。后来发现其实真的没有那么必须。
0 请登录后投票
   发表时间:2010-09-17  
dojotoolkit 写道
clue 写道
看样子Dojo的自带加载机制只适用于小应用,复杂的应用考虑到效率还是要异步加载才行。
并且,Dojo的依赖只有加载后才知道,所以导致了串联加载。(可以使用静态依赖解决此类问题,一次性将所有依赖计算出来,同时并发请求)

这样看来几乎没什么框架能做到尽善尽美,很多时候框架只能给个高些的起点而已,更多的还是要看设计扩展能力。


Release应用中不会有串联加载,因为build过程会把所有依赖关系的文件package成一个。
曾经也仔细思考了下为什么几乎所有著名框架都没有异步加载代码机制,难道那些人都这么笨么。。后来发现其实真的没有那么必须。



这个很有道理...  有事事情要么在build时候做,要么在coding的时候做...
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics