Skip to content

Upgrade to React 19.0.0 and React Native 0.79.3 #315

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

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

necolas
Copy link
Contributor

@necolas necolas commented Jun 11, 2025

This diff bumps the dep requirements to React Native 0.79.3 and React 19.0.0 (can't use 19.1.0 with React Native 0.79.3). For now, this diff is unmergable because React Native 0.79.3 has broken Flow type exports.

There is also a change to how React Native is configured to use W3C layout conformance. This can no longer be done automatically by RSD and requires the use of a special prop on the root html element of the app, which will render the necessary React Native component behind the scenes. On web, nothing happens.

Some unit tests are also modified to check for RSD-specific warnings and errors, to work around the increase in errors caused by the upgrade to react-test-renderer, which is deprecated for React 19. However, there is no good cross-platform testing alternative at this stage, with the React recommended 3P libraries having incompatible APIs.

Copy link

github-actions bot commented Jun 11, 2025

workflow: benchmarks/size

Comparison of minified (terser) and compressed (brotli) size results, measured in bytes. Smaller is better.

Results Base Patch Ratio
react-strict-dom/dist/dom/index.js
· compressed 2,513 2,517 1.00 +
· minified 8,695 8,695 1.00
react-strict-dom/dist/dom/runtime.js
· compressed 855 855 1.00
· minified 2,435 2,435 1.00
react-strict-dom/dist/native/index.js
· compressed 16,028 15,814 0.99 -
· minified 59,946 59,071 0.99 -

@necolas necolas force-pushed the react-19-update branch 2 times, most recently from 06fa166 to da1cc48 Compare June 11, 2025 21:30
Copy link

github-actions bot commented Jun 11, 2025

workflow: benchmarks/perf (native)

Comparison of performance test results, measured in operations per second. Larger is better.

Results Base Patch Ratio
css.create
· small 1,136,206 1,162,628 1.02 +
· small with units 440,897 413,506 0.94 !!
· small with variables 688,013 684,073 0.99 -
· several small 326,402 321,018 0.98 -
· large 207,191 207,718 1.00 +
· large with polyfills 148,639 147,526 0.99 -
· complex 102,263 99,956 0.98 -
· unsupported 221,271 222,909 1.01 +
css.createTheme
· simple theme 229,680 226,129 0.98 -
· polyfill theme 214,956 212,341 0.99 -
css.props
· small 243,470 293,650 1.21 !!
· small with units 191,512 222,031 1.16 !!
· small with variables 106,776 114,939 1.08 !!
· small with variables of units 75,309 79,466 1.06 !!
· large 104,147 126,803 1.22 !!
· large with polyfills 37,308 41,968 1.12 !!
· complex 23,528 25,382 1.08 !!
· unsupported 143,585 179,074 1.25 !!
· simple merge 162,403 185,721 1.14 !!
· wide merge 17,854 19,361 1.08 !!
· deep merge 17,509 18,894 1.08 !!
· themed merge 31,556 36,834 1.17 !!

necolas added 2 commits June 11, 2025 15:13
Ignore react-test-renderer deprecation warnings for now.

Close #300
React Native removed the 'experimental_layoutConformance' prop from View
and introduced the 'experimental_LayoutConformance' component. This new
component is expected to wrap any tree that needs to opt into W3C
layout.

Use of the new component now requires explicit setting of a prop on
'html.*' elements - 'data-layoutconformance="strict"'. This is done to
avoid wrapping every `View` in a `LayoutConformance` component, since
that now alters the component tree rather than just adding a prop.
Adding a prop to RSD elements is also preferred because it avoids two
other problems: 1) Developers having to import from 'react-native' in a
file that might otherwise be expected to be cross-platform, 2) React
Native for Web having to add support for this export to avoid crashing
Expo apps (unless using file forks.)

The use of another special 'data-*' attribute avoids React DOM warnings
about unrecognized properties on web.

Fix #245
@necolas
Copy link
Contributor Author

necolas commented Jun 11, 2025

Fix for RN flow types facebook/react-native#51908

Replace the polyfills with the built-in support for `marginInline`, etc.

Close #219
@MoOx
Copy link

MoOx commented Jun 19, 2025

🎉 RN 0.79.4 is available and fixes the issue with Flow types

@necolas
Copy link
Contributor Author

necolas commented Jun 23, 2025

0.79.4 is still broken

New pick request for 0.79.5 should fix it reactwg/react-native-releases#1000

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

Successfully merging this pull request may close these issues.

4 participants