Iframes et gestion de la mémoire en Javascript

J'ai des liens qui chargent des pages dans des iframes. J'ai surveillé l'accumulation de données en mémoire en utilisant le profileur de tas de mémoire de Google Chrome et j'ai remarqué des fuites dans la mémoire.

J'ai chargé la page et pris le premier instantané qui s'est ajouté à 2.69 MB. J'ai cliqué sur le lien qui ouvre une page dans un iframe et pris un autre instantané me donnant 14.58 MB au total. J'ai supprimé l'iframe en utilisant l'extrait jQuery suivant:

$('#myframe').unbind();
$('#myframe').remove();
/*
* By the way, I also tried $('#myframe > *') as a selector. 
* It still didn't work. Even if it would, it doesn't look like a viable solution to me.
* It looks too resource intensive.
*
* I forgot to mention that I am not using Ajax to load my pages
*/

, j'ai pris un autre instantané et obtenu 5.28 MB, qui a indiqué un écart de 2.59 MB par rapport à la valeur initiale, ce qui, selon ma compréhension, indique un fuite de mémoire.

Maintenant, ma question Est la suivante: si je supprime un iframe (qui inclut le document chargé), le garbage collector ne trouve-t-il pas nécessaire de supprimer également tous les objets contenus dans ce document de la mémoire? Ou devrai-je le faire manuellement?

Je pensais que si je charge un document dans un iframe, sa taille n'affectera pas l'utilisation de la mémoire sur la page parent. Je bien que ce soit considéré comme une fenêtre séparée, mais évidemment ce n'était pas une hypothèse bien informée de ma part.

Des suggestions sur la façon de s'y attaquer?

Merci.

25
demandé sur Sthe 2012-08-26 11:44:26

3 réponses

Dans l'iframe, déclenchez un rechargement avant de le retirer, puis retirez-le.

<a href="#">Remove</a>
<iframe src="url" />​

$('a').click(function(){
    $('iframe')[0].contentWindow.location.reload();
    setTimeout(function(){
       $('iframe').remove();
    }, 1000);
});​

DÉMO ici.

Additionnellement, vous pouvez faire un nettoyage manuel aussi-c'est-à-dire si vous avez des données dans vos cookies ou HTML5 localStorage.

window.onbeforeunload = function(){
    $(document).unbind().die();    //remove listeners on document
    $(document).find('*').unbind().die(); //remove listeners on all nodes
    //clean up cookies
    /remove items from localStorage
}
17
répondu Robin Maben 2012-09-01 17:25:56

Si des objets de l'iframe sont référencés dans un objet de la fenêtre principale, cet objet ne sera pas supprimé du DOM, donc, si vous avez quelque chose comme ceci:

Fenêtre Principale:

var object = {};
function iframe_call(data){
    object.iframe_data = data.something
}

Iframe:

function onClick(){
    parent_object.iframe_call(this);
}

Cela se produit surtout si vous référez des objets DOM.

2
répondu cuzzea 2016-12-30 20:40:18
var frame = document.getElementById("myframe");
frame.src = "about:blank";

Cela a fonctionné de moi et a empêché les fuites de mémoire. Ig vous devez détruire le parent de l'iframe, faites-le avec un certain retard pour éviter les fuites de mémoire

0
répondu Antonis 2016-11-27 16:49:15