日期:2014-05-16  浏览次数:20388 次

Extjs使用注意情况
    我们以ExtJS框架为例其他框架雷同,因为这是JavaScript语言的共性问题。

    ExtJS的经典应用是Tree与TabPlane的配合,点击左侧树节点动态下载页面代码创建表现层,然后通过一个新Tab展示。关闭Tab时 ExtJS会将依附于改Tab的组件彻底清除。但这个看似很完美的应用可能会耗尽你的内存。

    问题在于某些与Tab上下文无关的独立变量,例如创建页面时存在此类代码:“var win = new Ext.Window();”,他有自己独立的存放空间不依附于Tab。每次开关Tab便会重建且旧变量不被消除,最致命的是Ext.Window创建的 HTML代码会不断累积,造成Ext的Dom查询会以几何速度变慢。
    如何解决这类问题?答案是利用析构事件完成独立变量的销毁工作。我们为Tab中写一个listeners,监听beforedestroy并写入如下代码

listeners: {beforedestroy: function() {
    win.destroy();
    win = null;
    delete win;

    return true;
}}

这样win对象和win对象创建的html代码便会在关闭tab时被清理掉。


如果需要清理大量对象,我们可以通过一个对应表进行批量操作。


var win = new Ext.Window;
var win2 = new Ext.Window;
var win3 = new Ext.Window;
var test = [1,2, 3,4, 5];
var hxr = new window.HTTPXMLRequest();
var destroys = [win, win2, win3, test, hxr]; //对应表

listeners: {beforedestroy: function() { //批量清除
    for (k in destroys) {
        if (destroys[k].destroy)
            destroys[k].destroy();
        destroys[k] = null;
        delete destroys[k];
    }

    destroys = null
    delete destroys;

    return true;
}}


本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/tang280/archive/2010/04/15/5488234.aspx