Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Component re-renders indefinitely when changing state on render #3959

Closed
1 task done
jayrobin opened this issue Mar 31, 2023 · 3 comments
Closed
1 task done

Component re-renders indefinitely when changing state on render #3959

jayrobin opened this issue Mar 31, 2023 · 3 comments

Comments

@jayrobin
Copy link

  • Check if updating to the latest Preact version resolves the issue

Describe the bug
When changing state on render Preact will re-render indefinitely rather than throwing a "Too many re-renders" error.

To Reproduce

codesandbox

import { render } from 'preact';
import { useState } from 'preact/hooks';

let rerenderCount = 0;
function App() {
  const [, setValue] = useState({});
  console.log('rendering', rerenderCount);
  rerenderCount++;

  if (rerenderCount < 50) {
    setValue({});
  }

  return (
    <div>Counter: {value}</div>
  );
}

render(<App />, window.root);

Expected behavior

Logs rendering 0 to rendering 24, then throws "Too many re-renders" error (similar to React - thrown here)

Actual behavior

Logs rendering 0 to rendering 49. If you remove the rerenderCount < 50 conditional, it will run indefinitely and crash the browser.

@rschristian
Copy link
Member

rschristian commented Apr 26, 2024

When using preact/debug, which most Preact users will use in dev, #4349 addresses this.

React does seem to also detect infinite loops in prod too so I think we'll keep this open for the moment to better gauge whether we need a check/limit in preact/compat (or preact itself, I suppose)

Edit: Per Jovi, probably a bug. Whoops!

@JoviDeCroock
Copy link
Member

We do already have a check in place that it doesn't infinitely render but I reckon that maybe it still pushes to the _component queue and hence can still loop https://github.com/preactjs/preact/blob/main/src/diff/index.js#L224

@JoviDeCroock
Copy link
Member

JoviDeCroock commented Nov 1, 2024

This is fixed in latest with a preact/debug error throwing in development

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants