Como remover elementos DOM sem vazamentos de memory?

Meu código JavaSript cria uma lista de elementos do LI . Quando atualizo a lista, o uso da memory aumenta e nunca diminui. Eu testei em sIEve e isso mostra que o navegador mantém todos os elementos que deveriam ser deletados pelos $.remove() ou $.empty jQuery.

O que devo fazer para remover nós DOM sem o memory leaks?

Veja minha outra pergunta para o código específico.

O DOM preserva todos os nós DOM, mesmo se eles foram removidos da própria tree DOM, a única maneira de remover esses nós é fazer uma atualização de página (se você colocar a lista em um iframe, a atualização não será tão perceptível)

Caso contrário, você pode esperar que o problema fique ruim o suficiente para que o coletor de lixo dos navegadores seja forçado a entrar em ação (falando centenas de megabytes de nós não utilizados aqui)

A melhor prática é reutilizar nós.

EDIT: Tente isto:

 var garbageBin; window.onload = function () { if (typeof(garbageBin) === 'undefined') { //Here we are creating a 'garbage bin' object to temporarily //store elements that are to be discarded garbageBin = document.createElement('div'); garbageBin.style.display = 'none'; //Make sure it is not displayed document.body.appendChild(garbageBin); } function discardElement(element) { //The way this works is due to the phenomenon whereby child nodes //of an object with it's innerHTML emptied are removed from memory //Move the element to the garbage bin element garbageBin.appendChild(element); //Empty the garbage bin garbageBin.innerHTML = ""; } } 

Para usá-lo em seu contexto, você faria assim:

 discardElement(this); 

Isto é mais do que uma resposta real, mas também é bastante interessante.

A partir da especificação principal do W3C DOM (http://www.w3.org/TR/DOM-Level-2-Core/core.html):

As APIs do DOM Core são projetadas para serem compatíveis com uma ampla variedade de idiomas, incluindo linguagens de script de usuário geral e as linguagens mais desafiadoras usadas principalmente por programadores profissionais. Assim, as APIs do DOM precisam operar em uma variedade de filosofias de gerenciamento de memory, desde vinculações de linguagem que não exponham o gerenciamento de memory ao usuário, através daquelas (notavelmente Java) que fornecem construtores explícitos, mas fornecem um mecanismo automático de garbage collection para automaticamente recuperar memory não utilizada, para aqueles (especialmente C / C ++) que geralmente requerem que o programador aloque explicitamente a memory de object, rastreie onde ela é usada e liberte-a explicitamente para reutilização. Para garantir uma API consistente em todas essas plataformas, o DOM não aborda os problemas de gerenciamento de memory, mas os deixa para a implementação. Nenhuma das ligações de linguagem explícitas definidas pela API do DOM (para ECMAScript e Java) requer quaisquer methods de gerenciamento de memory, mas as ligações DOM para outros idiomas (especialmente C ou C ++) podem requerer tal suporte. Essas extensões serão de responsabilidade de quem adaptar a API do DOM a um idioma específico, não ao Grupo de Trabalho DOM.

Em outras palavras: o gerenciamento de memory é deixado para a implementação da especificação DOM em vários idiomas. Você teria que olhar para a documentação da implementação DOM em javascript para descobrir qualquer método para remover um object DOM da memory, que não é um hack. (No entanto, há muito pouca informação no site do MDC sobre esse tópico.)


Como uma observação sobre jQuery#remove e jQuery#empty : pelo que eu posso dizer, nenhum desses methods faz nada além de remover Object s de node DOM ou remover node DOM do document . Eles apenas removem Isso, claro, não significa que não há memory alocada para esses objects (mesmo que eles não estejam mais no document ).

Edit: A passagem acima foi supérflua, pois obviamente jQuery não pode fazer maravilhas e contornar a implementação DOM do navegador usado.

Você removeu algum ouvinte de evento? Isso pode causar vazamentos de memory .

O código abaixo não vaza no meu IE7 e outros navegadores:

    add 

    Pode ser que você possa tentar detectar algumas diferenças com seu código.
    Eu sei que o IE vaza muito menos quando você insere primeiro o nó no DOM antes de fazer qualquer coisa para ele, por exemplo: append events a ele ou preencher sua propriedade innerHTML .

    Se você tiver que “pós-corrigir” o vazamento, e deve fazê-lo sem rewrite todo o seu código para ter encerramentos, referências circulares, etc, em conta, use Douglas Crockfords Purge-método antes de excluir:

    http://javascript.crockford.com/memory/leak.html

    Ou use esta solução alternativa de correção de fechamento:

    http://laurens.vd.oever.nl/weblog/items2005/closures/