CS Fundamentals Trainer · JavaScript · Performance & Memory

A heap snapshot in Chrome DevTools shows a growing number of Detached HTMLDivElement entries each time a modal is closed. What is the most…

A heap snapshot in Chrome DevTools shows a growing number of `Detached HTMLDivElement` entries each time a modal is closed. What is the most likely cause?

  1. The browser keeps removed elements around for the back/forward cache and releases them at the next full navigation.
  2. The modal's elements were removed from the document, but JavaScript still references them, for example from an array, a closure or a listener on `window`.
  3. The modal was hidden with `display: none` instead of `visibility: hidden`, which detaches its nodes from the render tree.
  4. The nodes were created with `innerHTML` instead of `createElement`, and V8 keeps parsed markup in a separate heap.

Difficulty: medium

Answer this question

Related questions