fix(gatsby-image): fix memory leak and use more appropriate data structures for cache and listeners

[alexandernanberg]

• Refactor to use Set and Map instead of objects and arrays.
• Remove item from listeners when element is no longer observed (was probably a memory leak before, since we pushed items to the array with out ever removing them?).
• Add io listener in componentDidMount instead of in the refHandler.
• Remove io listener in componentWillUnmount.

[alexandernanberg]

Hmm can someone re-run the circleci e2e test? Can't reproduce it locally 🤔

[pieh]

I did rerun, but it still happened - didn't code yet, but maybe it's not false negative if it happened 2 times in a row?

[alexandernanberg]

Yeah I had forgotten to change the ref on the fixed div wrapper, e2e tests can be pretty useful 😬

[wardpeet]

This one looks good to me. Thanks for fixing this one. Memory leaks are hard to catch 👍

I added a few nitpicks 🙈

[alexandernanberg]

I might need to give this another proper look after I merged master into this again, there were some issues that I thought the tests would've picked up 🤔

[wardpeet]

I might need to give this another proper look after I merged master into this again, there were some issues that I thought the tests would've picked up 🤔

Could you elaborate which tests? And mabye add them ^^

[wardpeet]

I removed the createRef part as it's a breaking change, we will revisit this when we want to publish gatsby v3