Bug: memory leak in useReducer

[onnlucky]

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. (

   react/packages/react-reconciler/src/ReactFiberHooks.new.js

   Line 1937 in 269dd6e

   const pending = queue.pending;

   )

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 #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: #17953 #15088

[onnlucky]

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

[stale]

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!

[dcporter]

Bump

[bellmatthewf]

bump

[pbadenski]

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

[github-actions]

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!

[dcporter]

buuuuuuump

[mariomerendino]

Bump

[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 (fixed in #22445)

[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.

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

[NMinhNguyen]

That being said, I believe this still reproduces: #28981. However, I believe that issue is fixed by #25309 in React 19.