Simple app causing a memory leak?

[kaycebasques]

Is this a bug report?

I think so!

I was monitoring the Chrome DevTools Stack Overflow channel, and somebody asked for help as to why the listeners were increasing in this sample app they created: https://stackoverflow.com/q/48201104/1669860

Did you try recovering your dependencies?

I'm building via Glitch and repro'd locally, so this is unlikely.

Which terms did you search for in User Guide?

Sorry, don't have time to do this.

Environment

https://glitch.com/edit/#!/aback-dedication

Steps to Reproduce

1. Go to https://aback-dedication.glitch.me
2. Start a runtime perf recording in Chrome DevTools.
3. Force GC at 10s and 30s.
4. Stop recording after 60s.

Expected Behavior

Memory does not keep increasing. Listeners do not keep increasing.

Actual Behavior

Reproducible Demo

Demo:

https://aback-dedication.glitch.me

You can inspect the code at:

https://glitch.com/edit/#!/aback-dedication?path=src/App.js:24:12

Everything is default from the boilerplate create-react-app sample except for App.js.

[kaycebasques]

Actually, I didn't check the Glitch live demo that closely. When I force GC, it looks like memory drops back down to baseline. I'd still appreciate a second pair of eyes to see if anything fishy is going on!

[gaearon]

Fairly sure this isn't a memory leak but just excessive listener creation. It only happens in development builds, not in production. You can see these thread for more details: facebook/react#10576 and facebook/react#12141. We do create listeners but we expect GC to clean them up.

If you can reproduce a leak, let me know.