chromedevtools--chrome-devtools-mcp
Ewa
d19a2350f9
This PR add a new skill for detecting and removing memory leaks using take_memory_snapshot tool. Skill was based on authoritative material from own sources: * https://developer.chrome.com/docs/devtools/memory-problems * https://web.dev/articles/effectivemanagement as well as examples of memory leaks from public domain. It can be tested with https://github.com/devnook/mem-leak-example. Example prompt * A page running at localhost:3000 has memory issues when you click from home to contact tab and back. Can you fix it? The skill prefers using comparison tools like memlab instead of custom evaluate_script snippets to avoid directly reading of .heapsnpashot files to save context space and tokens. Fixes #1056 --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: Yusheng <113574546+yshngg@users.noreply.github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Alex Rudenko <OrKoN@users.noreply.github.com> Co-authored-by: Mathias Bynens <mathias@qiwi.be>
1.2 KiB
1.2 KiB
Using Memlab
Memlab is an E2E testing and analysis framework for finding JavaScript memory leaks.
Important Rule
NEVER read raw .heapsnapshot files directly. They are too large and will exceed context limits. Always use memlab commands to analyze them.
Analyzing Snapshots
You can use the take_memory_snapshot tool provided by the chrome-devtools-mcp extension to generate heap snapshots during an investigation. To find leaks, you generally need 3 snapshots:
- Baseline: Before the suspect action.
- Target: After the suspect action.
- Final: After reverting the suspect action (e.g., closing a modal, navigating away).
Once you have these 3 snapshots saved to disk, you can use memlab to find leaks:
npx memlab find-leaks --baseline <path-to-baseline> --target <path-to-target> --final <path-to-final>
You can also parse a single snapshot to find the largest objects or explore it individually:
npx memlab analyze snapshot --snapshot <path-to-snapshot>
Memlab will output the retainer traces for identified leaks. Use these traces to guide your search in the codebase.