Skip to content

[useMediaQuery] Ensure no tearing in React 18#28491

Merged
eps1lon merged 10 commits intomui:masterfrom
eps1lon:feat/useMediaQuery/uSES
Nov 17, 2021
Merged

[useMediaQuery] Ensure no tearing in React 18#28491
eps1lon merged 10 commits intomui:masterfrom
eps1lon:feat/useMediaQuery/uSES

Conversation

@eps1lon
Copy link
Member

@eps1lon eps1lon commented Sep 20, 2021

Uses React.useSyncExternalStore to prevent tearing and cascading updates in React 18.

Once use-sync-external-store is stable, we should be using that package instead of our shim. I didn't want to use experimental packages if stable versions of React used.

@eps1lon eps1lon added type: new feature Expand the scope of the product to solve a new problem. hook: useMediaQuery labels Sep 20, 2021
@mui-pr-bot
Copy link

mui-pr-bot commented Sep 20, 2021

Details of bundle changes

@material-ui/core: parsed: +0.11% , gzip: +0.12%
@material-ui/lab: parsed: +0.15% , gzip: +0.13%

Generated by 🚫 dangerJS against 08b3af3

@github-actions github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged. and removed PR: out-of-date The pull request has merge conflicts and can't be merged. labels Sep 27, 2021
@eps1lon eps1lon force-pushed the feat/useMediaQuery/uSES branch from fef0962 to 8bffccf Compare September 27, 2021 12:00
@github-actions github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged. and removed PR: out-of-date The pull request has merge conflicts and can't be merged. labels Sep 27, 2021
@github-actions github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged. and removed PR: out-of-date The pull request has merge conflicts and can't be merged. labels Oct 18, 2021
@eps1lon eps1lon force-pushed the feat/useMediaQuery/uSES branch from 8eea96f to b01158a Compare October 28, 2021 11:12
@github-actions github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged. and removed PR: out-of-date The pull request has merge conflicts and can't be merged. labels Oct 28, 2021
@eps1lon eps1lon force-pushed the feat/useMediaQuery/uSES branch from b85accc to e857d91 Compare November 1, 2021 20:34
@github-actions github-actions bot added PR: out-of-date The pull request has merge conflicts and can't be merged. and removed PR: out-of-date The pull request has merge conflicts and can't be merged. labels Nov 1, 2021
@eps1lon eps1lon changed the title [useMediaQuery] Avoid cascading update if Client does not match Server fallback [useMediaQuery] Ensure no tearing in React 18 Nov 16, 2021
@eps1lon eps1lon force-pushed the feat/useMediaQuery/uSES branch from e857d91 to bea0d3d Compare November 16, 2021 16:02
@github-actions github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged. label Nov 16, 2021
@eps1lon eps1lon force-pushed the feat/useMediaQuery/uSES branch 2 times, most recently from eaf5ea6 to 30afb18 Compare November 16, 2021 16:21
@eps1lon eps1lon force-pushed the feat/useMediaQuery/uSES branch from 30afb18 to 891f01a Compare November 16, 2021 16:25
@eps1lon eps1lon force-pushed the feat/useMediaQuery/uSES branch 2 times, most recently from c7e0a95 to fe09647 Compare November 16, 2021 16:31
@eps1lon eps1lon force-pushed the feat/useMediaQuery/uSES branch from fe09647 to 25e994e Compare November 16, 2021 16:32
@eps1lon eps1lon marked this pull request as ready for review November 16, 2021 17:27
@eps1lon eps1lon requested a review from a team November 16, 2021 17:27
Copy link
Member

@siriwatknp siriwatknp left a comment

Choose a reason for hiding this comment

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

The code looks good to me 👍. I will need to learn about new APIs in React 18 asap 😂

@eps1lon eps1lon merged commit e5471f3 into mui:master Nov 17, 2021
@eps1lon eps1lon deleted the feat/useMediaQuery/uSES branch November 17, 2021 22:13
eps1lon added a commit to eps1lon/material-ui that referenced this pull request Nov 24, 2021
eps1lon added a commit to eps1lon/material-ui that referenced this pull request Nov 24, 2021
eps1lon added a commit to eps1lon/material-ui that referenced this pull request Nov 25, 2021
@oliviertassinari oliviertassinari added the scope: system The system, the design tokens / styling foundations used across components. eg. @mui/system with MUI label Aug 17, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

hook: useMediaQuery scope: system The system, the design tokens / styling foundations used across components. eg. @mui/system with MUI type: new feature Expand the scope of the product to solve a new problem.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants