Memory leak debugging with Chrome DevTools MCP
Trouver et corriger les fuites mémoire JS/Node — capturer des heap snapshots, les comparer, parcourir retainers et dominators avec les outils mémoire MCP
- Quoi
- Trouver et corriger les fuites mémoire JS/Node — capturer des heap snapshots, les comparer, parcourir retainers et dominators avec les outils mémoire MCP
- Coût
- Gratuit
- Prérequis
- le serveur chrome-devtools-mcp installé et démarré avec le flag --memoryDebugging (les outils mémoire avancés n'existent qu'avec lui) ; une app JS/Node ou une page web à investiguer — le skill est un guide que l'agent suit, pas un logiciel
- Installation
- Copiez le prompt d’installation ci-dessous dans votre Muse — votre agent fait le reste.
Sélectionné par Skill Harbor — le skill memory-leak-debugging de @chromedevtools : guidance experte pour trouver, diagnostiquer et corriger les fuites mémoire dans les apps JavaScript et Node.js avec les outils mémoire MCP de Chrome DevTools. Principes de base : préférer les outils mémoire MCP (ne jamais lire les fichiers `.heapsnapshot` bruts — ils sont énormes et brûlent des tokens), isoler la fuite (navigateur vs Node), connaître les coupables usuels (nœuds DOM détachés, closures non gérées, globals, event listeners non retirés, caches sans limite), et fermer les snapshots chargés (`close_heapsnapshot`) pour libérer la mémoire du serveur. Les workflows : 1) capture — piloter la page avec les outils page-scoped, répéter les interactions 10 fois pour amplifier la fuite, snapshot aux états baseline/cible/final ; 2) comparaison — résumé d'abord avec `get_heapsnapshot_summary`, puis `compare_heapsnapshots` avec diffs de classes détaillés seulement pour les croissances suspectes ; 3) inspection des retainers et chaînes de dominators (`get_heapsnapshot_retainers`, `get_heapsnapshot_retaining_paths`, `get_heapsnapshot_dominators`, chaînes dupliquées) ; 4) filtres catégorisés (`objectsRetainedByDetachedDomNodes`, `objectsRetainedByEventHandlers`, `objectsRetainedByContexts`, `objectsRetainedByConsole`). Bémols honnêtes : les outils mémoire avancés n'existent que si le serveur chrome-devtools-mcp est démarré avec le flag `--memoryDebugging` ; se combine avec la fiche `chrome-devtools-cli` pour piloter le navigateur. Licence Apache-2.0. Skill Harbor ne vérifie jamais le code, examinez-le vous-même avant usage. Découvert via skills.sh.
Version :
Installation
Prérequis : le serveur chrome-devtools-mcp installé et démarré avec le flag --memoryDebugging (les outils mémoire avancés n'existent qu'avec lui) ; une app JS/Node ou une page web à investiguer — le skill est un guide que l'agent suit, pas un logiciel Installe-moi « Débogage de fuites mémoire avec Chrome DevTools MCP ». Il donne à mon agent le workflow de fuites mémoire de @chromedevtools : préférer les outils mémoire MCP aux fichiers .heapsnapshot bruts, isoler la fuite (navigateur vs Node), capturer des snapshots aux états baseline/cible/final (en répétant les interactions 10x pour amplifier), comparer les snapshots avec compare_heapsnapshots, parcourir les retainers et chaînes de dominators, utiliser les filtres catégorisés (nœuds DOM détachés, event handlers, contextes, console), et fermer les snapshots chargés après. Se combine avec le skill chrome-devtools-cli. Licence Apache-2.0. Dépôt : https://github.com/chromedevtools/chrome-devtools-mcp/blob/main/skills/memory-leak-debugging/SKILL.md 1. Récupère le fichier SKILL.md (et les fichiers d'aide éventuels) depuis le chemin du dépôt dans un dossier temporaire et résume en une ou deux phrases ce qu'il fait. 2. Vérification de sécurité : examine le SKILL.md et les scripts pour tout contenu suspect (appels réseau inattendus, commandes shell, collecte d'identifiants). Ce dépôt ne devrait contenir aucun secret en dur, les identifiants uniquement via le coffre sécurisé, les hôtes autorisés déclarés dans le SKILL.md. Vérifie que c'est bien le cas ici ; STOP sur tout signal d'alerte et dis-le-moi. 3. Installe-le comme skill : copie le SKILL.md et ses fichiers d'aide dans le répertoire des skills de l'agent, dans un dossier nommé « memory-leak-debugging ». 4. Vérifie sans appels réseau : frontmatter valide, fichiers en place. 5. Indique ce qui a été installé, où, et ce qu'il me reste à faire moi-même (p. ex. démarrer le serveur chrome-devtools-mcp avec --memoryDebugging ; pointer l'agent vers l'app/page avec la fuite suspectée). GitHub est optionnel : si j'ai un compte GitHub ou la CLI gh, tu peux l'utiliser ; sinon l'accès public suffit. Ne jamais l'exiger sauf s'il figure dans les prérequis ci-dessus. Règles : ne touche à rien en dehors du dossier temporaire et de la cible d'installation. Si quelque chose semble anormal, arrête-toi et demande-moi.
Questions
Comment installer une création ?
Chaque fiche produit contient un prompt d’installation à copier-coller. Collez-le dans votre Muse et il installe la création pour vous — sans configuration manuelle.
Où va mon argent ?
Directement au vendeur. Skill Harbor ne traite jamais les paiements : le paiement se fait sur la page du vendeur, généralement via Stripe.
Que signifie le ✓ à côté du nom d’un créateur ?
Il signifie que nous avons confirmé l’identité de la personne derrière la fiche. Il ne dit rien sur le code lui-même — vérifiez toujours une création avant de l’installer.