Extjs代码该如何写最好,比较合理?

本文探讨了ExtJS 3.3.1版本中遇到的DOM节点释放问题,并提供了解决方案,如窗口重用、在iframe中创建窗口等。此外还讨论了如何高效构建复杂应用框架及ExtJS与jQuery的区别。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >



在目前的Extjs3.3.1的版本上还是有些问题没有解决.


下面这段代码没有任何的写法变量引用问题.
但是在sIEve中查看时,关闭此窗口仍然会出现Dom节点无法释放的问题.当然这个问题不是我们的问题是Extjs框架的问题...
不知道在最新的4.0中有没有解决这个问题.


new Ext.Window({
  height: 300,
  width: 300,
    layout: 'auto',
    closeAction:'close',
    id:'ffffffwien1', 
    items: [
        {
            itemId: 'p1',
            title: 'Panel 1',
            id:'ffffff1',
            height: 150
        },
        {
            itemId: 'p2',
            title: 'Panel 2',
            id:'ffffff2',
            height: 150
        }
    ]

}).show();


(后来证实,extjs会定时的自动回收的)..


所以在这个问题的基础上我们只能尽量重用extjs中的window窗口.
当然除了重用已有window我们还有其它的方法解决这个问题,
比如在iframe中创建window.
或者干脆就不管这个小问题.实际上每打开关闭一个小window窗口所产生的DOM节点泄露的也就只有一个而已.
泄露个几百个节点.一般的机器还是可以忍受的...


对于现在的机器来讲唯一影响性能的不是cpu的执行速度不够快,而是内存不够折腾...
2G的内存,随便开几个东西就1.5G没了.ie开起来更是慢
所以按照我的看法应该是,需要的东西就重新开始创建,不需要的就彻底挂掉它.谁知道下次再用会是什么时候!!!

不过也不是所有window都得挂掉,如果一个window窗口经常会重复使用,那么我还是建议简单的hiden更能提高效率,内部的formpanl在window show的时候reset一下就好了



关于如何构建一个复杂应用的框架,我建议还是直接用extjs文档查阅器的代码.经过在sIEve中测试,在3.3.1中开很多的界面也不会很卡很占内存
关闭时内存销毁的也很彻底.


而且extjs doc 也是从后台动态加载文档内容然后渲染上样式的.总体看起来效果还不错.


所以我建议在设计界面的时候尽量能用html的还是用html不要总是想着用layout布局布出来.
layout布局出来是很耗时间的.


各大教程网站上都是采用这种直接写代码的形式来创建UI应用的.当然这种创建方式对与我们程序员来说是最好不过.因为不用我们来设计界面效果.
代码写好.界面就非常好看了..
但是这样的代码是依 牺牲 性能和内存为代价的... 而且写不好会出很多的问题.

你也知道js代码出了问题有多难发现问题的原因.当然对与老手来说时间久了也就不是什么难事.


另外有人说extjs不如jquery 锋利,其实可以去看看api文档,Element类中的那些方法.几乎jquery有的extjs都有.只是写法不同..

单单Element类已经完全满足普通web特效的开发了.


如果你是做系统就不要采用jquery,jquery做界面太麻烦,没有一套完整的ui 做起来非常的麻烦..还得自己找ui,相比之下还是extjs比较合适

笔者之前也是喜欢自己封装些控件,组件,欣然自得,但是后来我就不那么做了.因为自己弄的东西人家已经有了,而且还不如人家的稳定...

所以做开发就要学会 拿来主义, 已经有的东西就别自己搞一套,网上实在找不到的再自己发明一套.这样比较合适...

即便已有的组件不满足你的需求,最好也别再自己搞一套,还不如参与这个开源组件的开发使之更强大.. 这就是开源精神.


关于extjs的写法问题,有人提到过尽量不用id 我赞同, 因为id会造成一个组件被实例化多次,而被回收器一次性按照id全部回收的现象,导致,再次回收出错..

//1.所以要改变对组件引用的方式.不用id 改用 itemId , 改用itemId的组件, 要用父容器的panel.getComponent(itemId)来查找.

//2.直接采用变量的形式来访问..

例如:

var comb = new Ext.form.ComboBox();

var fp =new Ext.FormPanel({

items:[comb]

});

comb.setValue("123454543");

但是这第二种方式会造成内存泄露,所以最好在组件销毁的时候,把变量也销毁了,最好是不用了就销毁掉

例如

comb =null;










评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值