Maison >interface Web >js tutoriel >Plusieurs aspects qui provoquent facilement des fuites de mémoire JavaScript_javascript tips
Publié dans Google WebPerf (London WebPerf Group), 26 août 2014.
Les applications Web JavaScript efficaces doivent être fluides et rapides. Toute application qui interagit avec les utilisateurs doit réfléchir à la manière de garantir que la mémoire est utilisée efficacement, car si elle est trop consommée, la page plantera, obligeant l'utilisateur à recharger. Et tu ne peux que te cacher dans un coin et pleurer.
Le garbage collection automatique ne remplace pas une gestion efficace de la mémoire, en particulier dans les applications Web volumineuses et de longue durée. Dans cette conférence, nous montrerons comment gérer efficacement la mémoire via les DevTools de Chrome.
Et apprenez à résoudre les problèmes de performances tels que les fuites de mémoire, les pauses fréquentes du garbage collection et la surcharge globale de la mémoire, ce qui vous tue vraiment.
Addy Osmani a montré de nombreux exemples de fuites de mémoire dans Chrome V8 dans son PPT :
1) Supprimer les propriétés d'un Objet ralentira l'objet (consommant 15 fois plus de mémoire)
var o = { x : 'y' };
o = null; //Ça devrait être comme ça
2) Fermeture
Lorsqu'une variable en dehors de la fermeture est introduite dans la fermeture, l'objet ne peut pas être récupéré (GC) à la fin de la fermeture.
3) Fuite du DOM
Lorsque le COM d'origine est supprimé, la référence du nœud enfant ne peut pas être recyclée à moins qu'elle ne soit supprimée.
//Dans l'arborescence COM, leafRef est un nœud enfant de treeFre
var leafRef = select('#feuille');
var corps = select('corps');
body.removeChild(treeRef);
//#tree ne peut pas être recyclé car treeRef est toujours là
//Solution :
treeRef = null;
//L'arbre ne peut pas encore être recyclé car le résultat feuille leafRef est toujours là
leafRef = null;
//Maintenant, l'#arbre peut être libéré.
4) Fuite des minuteries
Les minuteries sont également un endroit courant où des fuites de mémoire se produisent :
buggyObject.callAgain();
//Même si vous souhaitez recycler, la minuterie est toujours là
buggyObject = null;
>
5) Mémoire de débogage
L'outil de débogage de mémoire intégré à Chrome peut facilement vérifier l'utilisation de la mémoire et les fuites de mémoire :
Cliquez sur Enregistrer dans la chronologie -> Mémoire :
Pour plus d'informations, veuillez consulter le PPT original.