Consider 2 components – PlaylistsComponent, and PlaylistComponent.
PlaylistComponent is only visible via PlaylistsComponent if there are songs related to that playlist and PlaylistComponent holds the count of those songs inside its own component state, the conditional visibility is controlled by PlaylistsComponent. PlaylistComponent can remove songs via a remove function that is passed down from PlaylistsComponent, when it removes a song the count in its own component state will be updated.
Imagine we had 2 songs to start, and we remove one. This informs PlaylistsComponent that songs are one less will then update the PlaylistComponent state with the count now set to 1. Let’s say we decided to delete the final song, we again call the remove function passed from PlaylistsComponent, it updates its own state to know that this Playlist now has 0 songs, and the condition to show the PlaylistComponent will now be false, the issue is that we weren’t finished yet in PlaylistComponent, we are still about to update the count of songs to 0. This is what causes the memory leak, this component has now been unmounted after the current rerender because of the conditional visibility in its parent, and some state is trying to be updated that doesn’t exist anymore. This is poor design and can cause performance issues.