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

[compiler] Off-by-default validation against setState directly in passive effect #30685

Merged
merged 2 commits into from
Aug 15, 2024

Conversation

josephsavona
Copy link
Contributor

@josephsavona josephsavona commented Aug 14, 2024

Stack from ghstack (oldest at bottom):

Per discussion today, adds validation against calling setState "during" passive effects. Basically, it's fine to schedule setState to be called (via a timeout, listener, etc) but generally not recommended to call setState during the effect since that will trigger a cascading render.

This validation is off by default, i'm putting this up for discussion and to experiment with it internally.

Rationale: https://react.dev/learn/you-might-not-need-an-effect

…sive effect

Per discussion today, adds validation against calling setState "during" passive effects. Basically, it's fine to _schedule_ setState to be called (via a timeout, listener, etc) but generally not recommended to call setState during the effect since that will trigger a cascading render.

This validation is off by default, i'm putting this up for discussion and to experiment with it internally.

[ghstack-poisoned]
Copy link

vercel bot commented Aug 14, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
react-compiler-playground ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 14, 2024 2:47am

josephsavona added a commit that referenced this pull request Aug 14, 2024
…sive effect

Per discussion today, adds validation against calling setState "during" passive effects. Basically, it's fine to _schedule_ setState to be called (via a timeout, listener, etc) but generally not recommended to call setState during the effect since that will trigger a cascading render.

This validation is off by default, i'm putting this up for discussion and to experiment with it internally.

ghstack-source-id: da72a35f991ea9d45bf78a98e486df5bcaebdaa5
Pull Request resolved: #30685
@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Aug 14, 2024
…ctly in passive effect"


Per discussion today, adds validation against calling setState "during" passive effects. Basically, it's fine to _schedule_ setState to be called (via a timeout, listener, etc) but generally not recommended to call setState during the effect since that will trigger a cascading render.

This validation is off by default, i'm putting this up for discussion and to experiment with it internally.

Rationale: https://react.dev/learn/you-might-not-need-an-effect

[ghstack-poisoned]
josephsavona added a commit that referenced this pull request Aug 14, 2024
…sive effect

Per discussion today, adds validation against calling setState "during" passive effects. Basically, it's fine to _schedule_ setState to be called (via a timeout, listener, etc) but generally not recommended to call setState during the effect since that will trigger a cascading render.

This validation is off by default, i'm putting this up for discussion and to experiment with it internally.

ghstack-source-id: 5f385ddab59561ec3939ae5ece265dfee4f2cb56
Pull Request resolved: #30685
* alternatives. See https://react.dev/learn/you-might-not-need-an-effect for examples.
*/
export function validateNoSetStateInPassiveEffects(fn: HIRFunction): void {
const setStateFunctions: Map<IdentifierId, Place> = new Map();
Copy link
Contributor

@mvitousek mvitousek Aug 14, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is profoundly nitpicky given how hard it is to construct an example of this, but we might want to first detect all the setStateFunctions in a component before taking another pass and detecting errors, because of setState functions that might be hoisted. Compare against this, which has the definitions reordered to not be hoisted

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Per offline discussion the same issue applies to several other validations, let's land this and do a follow-up pass to apply the same two-phase approach to all the validations (and maybe take that as a chance to create more of a framework for validations)

@josephsavona josephsavona merged commit fa560ce into gh/josephsavona/36/base Aug 15, 2024
19 checks passed
josephsavona added a commit that referenced this pull request Aug 15, 2024
…sive effect

Per discussion today, adds validation against calling setState "during" passive effects. Basically, it's fine to _schedule_ setState to be called (via a timeout, listener, etc) but generally not recommended to call setState during the effect since that will trigger a cascading render.

This validation is off by default, i'm putting this up for discussion and to experiment with it internally.

ghstack-source-id: 5f385ddab59561ec3939ae5ece265dfee4f2cb56
Pull Request resolved: #30685
@josephsavona josephsavona deleted the gh/josephsavona/36/head branch August 15, 2024 14:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed React Core Team Opened by a member of the React Core Team
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants