React Why Unmount Component Slow : <p>I have a component that wraps a bunch of ReactList components.
ReactList component is a component that does infinite scrolling ie only load what's on viewport. It has couple of modes: simple and uniform. I'm using simple which just loads and loads as you scroll down (making the scrollable page longer). Uniform loads and removes the above section that is now out of viewport. I tried using uniform mode, and if it worked I wouldn't even need to ask what I'm about to, but it's super buggy and defeats the purpose. Simple on the other hand is super fast scrolling and loading is equally fast.</p>

<p>I broken down my list into few groups where user can click and it will load that ReactList component. If the scrollable page is short, ie, user hasn't scrolled all the way down, changing between the group of lists is fast enough. ~2s. However, if the page is scrolled all the way down, and trying to change list takes ~6s.</p>

<p>I noticed that the page is fully loaded too, ie nothing more to load. So okay, I think maybe if I change the key for the wrapper parent component and just remount the component, it should be fast right? Nope. The component that reloads is short, only one viewport length, but it takes around ~5s.</p>

<p>I noticed changing out of the fully loaded list component page to just regular single line text "Hello world" component still took around the same amount! ~5s. What's up with that?</p>

<p><strong>QUESTION: Why is unmounting a long page with many small components in a list take so long to just unmount?</strong></p>

<p>Sorry I realize this is long and full of text but I thought I should explain my situation.</p>
