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

Simplify nested hook warning logic in dev #26238

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

sophiebits
Copy link
Collaborator

We have so many dispatchers. And with my changes in #26232 it's a bit harder to see if the previous logic was correct. Here I'm moving the flag to a separate value which makes it easier to see that it will work properly with the live dispatcher switch and that the prod behavior is not affected.

I cheated and mutated ContextOnlyDispatcher in place in dev (previously ContextOnlyDispatcher.readContext would not warn when in a state update but that dispatcher wouldn't be active at the times it's relevant).

Also adds the hook ordering warnings to useMemoCache.

We have so many dispatchers. And with my changes in facebook#26232 it's a bit harder to see if the previous logic was correct. Here I'm moving the flag to a separate value which makes it easier to see that it will work properly with the live dispatcher switch and that the prod behavior is not affected.

I cheated and mutated ContextOnlyDispatcher in place in dev (previously ContextOnlyDispatcher.readContext would not warn when in a state update but that dispatcher wouldn't be active at the times it's relevant).

Also adds the hook ordering warnings to useMemoCache.
@facebook-github-bot facebook-github-bot added CLA Signed React Core Team Opened by a member of the React Core Team labels Feb 25, 2023
@react-sizebot
Copy link

Comparing: 5641660...7265ff7

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.min.js = 154.48 kB 154.48 kB = 48.77 kB 48.77 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js = 156.47 kB 156.47 kB = 49.43 kB 49.43 kB
facebook-www/ReactDOM-prod.classic.js = 530.88 kB 530.88 kB = 94.58 kB 94.58 kB
facebook-www/ReactDOM-prod.modern.js = 514.80 kB 514.80 kB = 92.13 kB 92.13 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name +/- Base Current +/- gzip Base gzip Current gzip
facebook-www/ReactDOM-dev.classic.js = 1,341.00 kB 1,328.66 kB = 292.02 kB 291.36 kB
facebook-www/ReactDOM-dev.modern.js = 1,313.34 kB 1,301.00 kB = 286.83 kB 286.19 kB
oss-experimental/react-dom/cjs/react-dom-unstable_testing.development.js = 1,186.57 kB 1,175.13 kB = 264.41 kB 263.81 kB
facebook-www/ReactDOMTesting-dev.classic.js = 1,214.93 kB 1,203.20 kB = 269.63 kB 269.07 kB
oss-stable/react-dom/cjs/react-dom.development.js = 1,182.77 kB 1,171.33 kB = 263.65 kB 263.06 kB
oss-stable-semver/react-dom/cjs/react-dom.development.js = 1,182.74 kB 1,171.30 kB = 263.63 kB 263.03 kB
oss-stable/react-dom/umd/react-dom.development.js = 1,239.82 kB 1,227.76 kB = 266.51 kB 265.94 kB
oss-stable-semver/react-dom/umd/react-dom.development.js = 1,239.80 kB 1,227.74 kB = 266.49 kB 265.91 kB
facebook-www/ReactDOMTesting-dev.modern.js = 1,184.56 kB 1,172.83 kB = 263.70 kB 263.12 kB
oss-experimental/react-dom/cjs/react-dom.development.js = 1,193.24 kB 1,181.24 kB = 265.66 kB 265.03 kB
oss-experimental/react-dom/umd/react-dom.development.js = 1,250.87 kB 1,238.21 kB = 268.52 kB 267.98 kB
react-native/implementations/ReactNativeRenderer-dev.fb.js = 886.76 kB 875.72 kB = 192.74 kB 192.17 kB
react-native/implementations/ReactFabric-dev.fb.js = 878.98 kB 867.94 kB = 190.97 kB 190.40 kB
react-native/implementations/ReactNativeRenderer-dev.js = 849.98 kB 838.92 kB = 185.53 kB 184.98 kB
react-native/implementations/ReactFabric-dev.js = 842.18 kB 831.12 kB = 183.78 kB 183.24 kB
oss-stable/react-reconciler/cjs/react-reconciler.development.js = 858.19 kB 846.75 kB = 182.88 kB 182.29 kB
oss-stable-semver/react-reconciler/cjs/react-reconciler.development.js = 858.17 kB 846.73 kB = 182.85 kB 182.26 kB
oss-stable/react-art/umd/react-art.development.js = 884.20 kB 872.16 kB = 185.91 kB 185.28 kB
oss-stable-semver/react-art/umd/react-art.development.js = 884.17 kB 872.13 kB = 185.88 kB 185.26 kB
oss-experimental/react-reconciler/cjs/react-reconciler.development.js = 866.43 kB 854.43 kB = 184.36 kB 183.74 kB
facebook-www/ReactART-dev.classic.js = 881.50 kB 869.18 kB = 186.59 kB 185.91 kB
facebook-www/ReactART-dev.modern.js = 870.30 kB 857.98 kB = 184.30 kB 183.64 kB
oss-experimental/react-art/umd/react-art.development.js = 892.90 kB 880.26 kB = 187.37 kB 186.82 kB
oss-stable/react-art/cjs/react-art.development.js = 770.73 kB 759.31 kB = 166.91 kB 166.32 kB
oss-stable-semver/react-art/cjs/react-art.development.js = 770.71 kB 759.29 kB = 166.89 kB 166.30 kB
facebook-www/ReactTestRenderer-dev.classic.js = 781.12 kB 769.41 kB = 167.84 kB 167.24 kB
facebook-www/ReactTestRenderer-dev.modern.js = 781.12 kB 769.41 kB = 167.84 kB 167.24 kB
facebook-react-native/react-test-renderer/cjs/ReactTestRenderer-dev.js = 764.86 kB 753.24 kB = 164.62 kB 164.01 kB
oss-experimental/react-test-renderer/cjs/react-test-renderer.development.js = 750.69 kB 739.27 kB = 162.91 kB 162.34 kB
oss-stable/react-test-renderer/cjs/react-test-renderer.development.js = 750.32 kB 738.90 kB = 162.82 kB 162.25 kB
oss-stable-semver/react-test-renderer/cjs/react-test-renderer.development.js = 750.30 kB 738.88 kB = 162.79 kB 162.22 kB
oss-experimental/react-test-renderer/umd/react-test-renderer.development.js = 786.43 kB 774.39 kB = 164.70 kB 164.12 kB
oss-stable/react-test-renderer/umd/react-test-renderer.development.js = 786.04 kB 774.00 kB = 164.62 kB 164.03 kB
oss-stable-semver/react-test-renderer/umd/react-test-renderer.development.js = 786.01 kB 773.97 kB = 164.59 kB 164.01 kB
oss-experimental/react-art/cjs/react-art.development.js = 778.97 kB 766.99 kB = 168.38 kB 167.75 kB

Generated by 🚫 dangerJS against 7265ff7

Comment on lines +2924 to +2929

ContextOnlyDispatcher.readContext = function <T>(
context: ReactContext<T>,
): T {
warnInvalidContextAccess();
return readContext(context);
Copy link

@Pranav-yadav Pranav-yadav Feb 26, 2023

Choose a reason for hiding this comment

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

Cannot assign function to ContextOnlyDispatcher.readContext because property readContext is not writable.

One of the ways to tackle this will be to declare warnIfDevInvalidContextAccess fn such that:

  • it'll behave as warn-IfDev-InvalidContextAccess
  • which may use __DEV__(?) on top of current behaviour of warnInvalidContextAccess
  • and to declare it in the adjacent scope of ContextOnlyDispatcher

and declaring ContextOnlyDispatcher as:

export const ContextOnlyDispatcher: Dispatcher = {
  readContext: function <T>(
    context: ReactContext<T>,
  ): T {
    warnIfDevInvalidContextAccess();// the above refactored fn
    return readContext(context);
  },
  ...,
}

@sophiebits
Copy link
Collaborator Author

@acdlite thoughts on this PR? (getting rid of the InvalidNestedHooksDispatcherOn{Mount,Update,Rerender}InDEV dispatchers in favor of tracking a separate flag that the other dev dispatchers read)

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.

4 participants