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