PDA

View Full Version : delete components correctly ???



jo.sh
14 Mar 2011, 2:17 PM
at the moment we have a problem with respect to the elimination of the components that are created during the flow of the application, next is the solution which we took, but we want to know if this code can be improved or be optimized. some recommendation to optimize the elimination in IE?


/*
* delete component and childs
*/
Menu.builder.fncEliminarComponente = function(idComponente) {

// inicializando variables
var eliminado = false;

// recuperando el componente
var componente = Ext.getCmp(idComponente);

if (componente != null) {

// valida si el componente a eliminar es
// es una instancia o extiende de Ext.continer
if( componente instanceof Ext.Container ) {
componente.hide();
}

// eliminando los hijos del componente
Menu.builder.fncEliminaDecendencia(componente.items);

fncEliminaNodo(componente);

eliminado = true;
}

// valida si es un navegador de microsoft
if (Ext.isIE || Ext.isIE6 || Ext.isIE7 || Ext.isIE8) {
CollectGarbage();
}

return eliminado;
};

/*
* delete recursive items
*/
Menu.builder.fncEliminaDecendencia = function(nodos) {

var esNodo = false;

// validacion inicial
if (nodos != undefined && nodos != null) {

var continuar = false;

try {
// validando si aun contiene elementos (sentencia de paro)
continuar = nodos.getCount() > 0;
} catch (e) {
// manejo de excepcion.
continuar = false;
} finally {

// evalua si se puede continuar con la eliminacion.
if (continuar) {

nodos.each(function(nodo, index, length) {

if (Menu.builder.fncEliminaDecendencia(nodo.items)) {
fncEliminaNodo(nodo);
} else {
fncEliminaNodo(nodo);
}

});

try {
Ext.destroy(nodos);
delete nodos;
nodos = null;
} catch (e) {
}

} else {
esNodo = true;
}
}
} else {
esNodo = true;
}

return esNodo;
};

/*
* delete component
*/
function fncEliminaNodo(nodo) {

if (nodo.getXType() == 'combo' || nodo.getXType() == 'dataview'
|| nodo.getXType() == 'paging' || nodo.getXType() == 'timefield'
|| nodo.getXType() == 'editorgrid' || nodo.getXType() == 'grid'
|| nodo.getXType() == 'propertygrid') {

if (nodo.getStore() != undefined && nodo.getStore() != null) {
try {nodo.getStore().removeAll();} catch (e) {}
try {nodo.getStore().commitChanges();} catch (e) {}
try {nodo.getStore().destroy();} catch (e) {}
}

delete nodo.store;
nodo.store = null;
} else if(nodo.getXType() == 'mif' || nodo.getXType() == 'iframeportlet') {
nodo.resetFrame('about:blank');
nodo.setSrc('javascript:void(0)');
}

if (nodo.items != null) {Menu.builder.fncEliminaDecendencia(nodo.items);}

try {Ext.destroy(nodo.items);} catch (e) {}
try {Ext.destroy(Ext.getDom(nodo.getId()));} catch (e) {}
try {Ext.destroy(nodo.getEl());} catch (e) {}
try {Ext.destroy(nodo);} catch (e) {}

delete nodo;
nodo = null; // asignacion nula
}

mankz
14 Mar 2011, 2:31 PM
Hmm, are you having problems if you only use:



Ext.getCmp(idComponente).destroy();

jo.sh
14 Mar 2011, 3:18 PM
the problem is in which using this sentence, the objects are not eliminated correctly and therefore, the memory that occupies these components is not released by the navigator, for this reason the memory of the navigator grows of progressive and almost exponential form. We occupied to the function to lower it indeed the memory levels and it has been to us

look, the results were obtained after sailing by the application

browser IE7 before implement function
IE7 after implement function

MEMORY CONSUMPTION 783.26 MB
181.06 MB







browser firefox before implement function
firefox after implement function

MEMORY CONSUMPTION 160.59 MB
120.33 MB







browser chrome before implement function
chrome after implement function

MEMORY CONSUMPTION 158.94 MB
79.16 MB

jo.sh
14 Mar 2011, 3:22 PM
the memory consumption was reduced of the following form occupying the mentioned function:

MEMORY CONSUMPTION(IE7) 783.26 MB to -> 181.06 MB
MEMORY CONSUMPTION(firefox) 160.59 MB to -> 120.33 MB
MEMORY CONSUMPTION(chrome) 158.94 MB to -> 79.16 MB

steffenk
14 Mar 2011, 3:52 PM
even you got results, it's correct what Mats says.

Instead of wildly destroying (sry ;)) you should check which components are destroyed and which not.
Use event listeners to see which components throw destroy event to exclude them.
Mostly there is superfluous creation of same elements or hiding only, most can be eleminateed by refactor some methods or code cleanups.

jo.sh
15 Mar 2011, 8:23 AM
A favor but, we have also noticed that remains many objects DOM like DIVS without reference which they were not eliminated when the Extjs components are eliminated. You can indicate to us what is the best strategy to eliminate the elements div that extjs cannot eliminate, since too much sweepings is generated. We are thankful for your support, greetings!