All 10 Memory Management & Garbage Collection questions
More in Memory Management & Garbage Collection
How do closures unintentionally keep large objects alive longer than expected? What is the difference between the generational garbage collection strategy's 'young' and 'old' generations? How does mark-and-sweep garbage collection actually determine which objects are reachable? How can a growing array used as a cache with no eviction policy become a memory leak? Why can setInterval() be a subtle source of memory leaks, and how do you avoid it? How does using WeakMap/WeakSet as a design choice actively prevent certain classes of memory leaks?
Advertisement
Back to results for “Debugging”
JavaScript › Memory Management & Garbage Collection

How would you use Chrome DevTools' heap snapshot comparison to find a leak's source?

Advanced

Answer

Take a heap snapshot, perform the suspected leaking action several times, take another snapshot, then use the 'Comparison' view to see which object types grew in count between snapshots — objects that keep increasing without ever decreasing point directly at the leak's retaining structure.
// Workflow, not code:
// 1. Take Snapshot 1
// 2. Trigger the suspected action 5x
// 3. Take Snapshot 2
// 4. Filter Comparison view by '#Delta', inspect retainers of growing objects
Real-world example Pinpointing that a 'DetachedHTMLDivElement' count keeps growing, revealing DOM nodes removed from the page but still referenced in JS.

Common follow-ups: What does a 'Detached DOM tree' in a heap snapshot specifically indicate?

Debugging Testing & Tooling
All 10 Memory Management & Garbage Collection questions