react icon indicating copy to clipboard operation
react copied to clipboard

Bug: memory leak in useReducer

Open onnlucky opened this issue 3 years ago • 11 comments

React version: 17.0.2

When using React.useReducer() and a new action is pushed, but the reducer returns the current state, the operation is queued in a pending queue. But if the component isn't re-rendered for other reasons, it will never start work on that pending queue. This can potentially rack up a huge list of pending.next.next.next.next...

Steps To Reproduce

  1. https://codesandbox.io/s/unruffled-moore-wp5wq?file=/src/App.js
  2. click increment a few times
  3. place a breakpoint in react-dom.development.js line 16072, click increment, that should hit the break point, then expand queue.pending.next.next.next and see they are unique actions. (https://github.com/facebook/react/blob/269dd6ec5da85fc5ca819cfa010ce60dd1c83ec6/packages/react-reconciler/src/ReactFiberHooks.new.js#L1937)

Link to code example: https://codesandbox.io/s/unruffled-moore-wp5wq?file=/src/App.js

The current behavior

There is no change in behavior, but it is potentially racking up an enormous list of pending tasks, costing memory.

The expected behavior

Flat memory usage. Reducer doesn't run twice on the same action.

This is very much related to https://github.com/facebook/react/pull/15198 because later the reducer might run, and basically reduce the same actions again. Which is unexpected. And if using side-effects, doesn't produce the expected results.

Other related bugs: https://github.com/facebook/react/issues/17953 https://github.com/facebook/react/issues/15088

onnlucky avatar Jun 16 '21 16:06 onnlucky

For a second example that doesn't have any side effects, thus doesn't trigger https://github.com/facebook/react/pull/15198, but still has the memory leak, see here: https://codesandbox.io/s/bold-sun-k5nig?file=/src/App.js

onnlucky avatar Jun 17 '21 08:06 onnlucky

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

stale[bot] avatar Jan 09 '22 00:01 stale[bot]

Bump

dcporter avatar Jan 09 '22 01:01 dcporter

bump

bellmatthewf avatar Jun 30 '23 08:06 bellmatthewf

It's surprising that this issue isn't even acknowledged..

pbadenski avatar Jun 30 '23 10:06 pbadenski

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

github-actions[bot] avatar Apr 10 '24 14:04 github-actions[bot]

buuuuuuump

dcporter avatar Apr 12 '24 02:04 dcporter

Bump

mariomerendino avatar Apr 23 '24 21:04 mariomerendino

The CodeSandbox repro no longer results in a memory leak using 18.3.1 for what it’s worth, so this particular issue can probably be marked as fixed unless a more up-to-date repro is provided. I did notice that using 17.0.2 React would accumulate all the actions that were dispatched while the reducer returned the same state, and subsequently replay them, but that’s no longer the case using the latest React (fixed in https://github.com/facebook/react/pull/22445)

NMinhNguyen avatar May 15 '24 02:05 NMinhNguyen

The CodeSandbox repro no longer results in a memory leak using 18.3.1 for what it’s worth, so this particular issue can probably be marked as fixed unless a more up-to-date repro is provided. I did notice that using 17.0.2 React would accumulate all the actions that were dispatched while the reducer returned the same state, and subsequently replay them, but that’s no longer the case using the latest React.

Thank you for the reply!! The project I noticed this is using React 16, so I definitely need to upgrade.

mariomerendino avatar May 15 '24 02:05 mariomerendino

That being said, I believe this still reproduces: https://github.com/facebook/react/issues/28981. However, I believe that issue is fixed by https://github.com/facebook/react/pull/25309 in React 19.

NMinhNguyen avatar May 15 '24 05:05 NMinhNguyen

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

github-actions[bot] avatar Aug 13 '24 16:08 github-actions[bot]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!

github-actions[bot] avatar Aug 20 '24 17:08 github-actions[bot]