Débogage JavaScript : comment tracer efficacement les memory leaks ?

[sandra1960]

Coucou les devs ! J'ai une SPA en React qui devient super lente après quelques heures d'utilisation. Chrome DevTools montre une croissance mémoire constante. Des outils ou techniques pour identifier précisément les fuites ?

[le_julie]

Classique ! Commence par le Memory Profiler de Chrome. Fais des snapshots avant/après des interactions et compare. Souvent c'est des event listeners oubliés ou des stores Redux pas nettoyés.

[admin_sys_du_13]

J'ajouterais : vérifie tes useEffect() ! Les dépendances mal gérées sont une source fréquente de leaks. Et si tu utilises des libs comme D3.js ou Three.js, elles sont notoires pour ça.

[sandra1960]

Merci ! Effectivement j'ai plusieurs Three.js dans le projet... Vous conseillez quoi comme pattern pour clean ça ? Des destructeurs explicites ?

[julien_du_62]

Pour Three.js j'ai une checklist : 1) dispose() sur les geometries/materials 2) cancelAnimationFrame 3) vérifier les textures dans le cache. J'ai un utilitaire maison si tu veux, je peux te passer le snippet.

[le_julie]

Et n'oublie pas de tester en navigation privée pour éliminer les extensions Chrome comme variable ! J'ai déjà perdu 2 jours sur un leak qui venait en fait de Grammarly...