facebook/react

Bug: Potential Memory Leak - Detached elements after DOM Update due to state change

cheng500 opened this issue · 3 comments

cheng500 commented

React version: 18.3.1

Steps To Reproduce

  1. Create a boolean toggle
  2. Show 2 different elements based on toggle
  3. The element that is hidden still exists but is detached
  4. Repeat to create multiple detached elements

image

Link to code example:
https://codesandbox.io/p/sandbox/modest-yalow-n2m86y
https://n2m86y.csb.app/

The current behavior

Elements are never removed from memory

The expected behavior

Elements should be removed from memory

mfu2002 commented

For some reason, I cannot recreate this bug on my laptop. Can you try to see if you are able to recreate this issue on a different browser or device?

EDIT: Sorry, I was incorrect. I did manage to create this bug on my laptop. (I was using the debugger incorrectly).

mfu2002 commented

image
It seems the objects is being referenced by a map in System / Context (if I am reading this menu correctly... which I might not be). I don't completely know what system / context is or whether it is something we can change from our code (it might be a browser thing)

cheng500 commented

@mfu2002 Sorry, I was incorrect as well. This should be a non issue. The "bug" is tied to react developer tools. The behavior does not occur when using a browser without react developer tools. Can you confirm?