When Discord attempted to upgrade React from 16.5 to 16.7 (the version with hooks), we would get user reports that Discord was seen using unacceptable amounts of memory. We would repeatedly try a fix, ship it, get reports again, and revert.

It initially felt like the fix was somewhere in Discord’s codebase. However, after many attempts and a lot of time debugging, the investigation seemed unbounded so I started digging into React itself. After understanding the new React Fiber architecture, I was able to patch React to remove the memory leaks. It felt “hacky” but fixed the issue and Discord was able to modernize the codebase and adopt React hooks.

I opened a PR on the React repo. It seemed like other teams were running into similar issues. The patch consisted of 3 changes that all seemed necessary to clear Discord’s memory leak problem. One was upstreamed and released in React 16.9. Eventually, the other changes were released as part of React 18.

Here’s a post on the Discord blog I wrote about the investigation. Note my writing was edited to match the blog’s tone at the time.