The future of React Native for Web

Over the next few months I’ll be working through some significant changes to React Native for Web. These changes will be made on the next branch. The motivation for these changes is to:

1. Update the library to use modern React features (e.g., Hooks) in preparation for Concurrent Mode.
2. Move away from depending on ReactDOM’s unstable-native-dependencies export, which we’d like to remove from ReactDOM.
3. Resolve long-standing issues with the Responder Event Plugin.
4. Prototype high-level gesture systems for ReactDOM.
5. Simplify and improve the performance of the Touchable/Pressable components.

Hooks rewrite (done)

Rewriting components to use Hooks is a prerequisite for all the other changes. Hooks simplify the implementations of components and offer an opportunity to resolve many existing bugs.

Responder system rewrite (done)

Replacing the Responder Event System with a user-space implementation. See #1568 for more details.

Touchables rewrite (done)

Better integrating the PressResponder with DOM expectations, to improve the UX of Touchables. See #1591 for more details.

Canary releases

Most up-to-date canary is shown below. Please report regressions caused by canary releases. Post a comment below and include the canary version, as well as a codesandbox that reproduces the issue if possible.

0.0.0-d33e107ba (5 June 2020)

• Changed: Remove hitSlop prop handling. Let browsers use their own automatic hitslop for touch interactions.
• Changed: Remove TabBarIOS and TimePickerAndroid exports
• Changed: Rewrite of the gesture responder system
• Changed: All components (except vendor ones) implemented using React Hooks. This build regresses Image caching, which will be reintroduced before a stable release.
• Changed: The onLayout prop now requires a ResizeObserver polyfill to work, and does not fallback to window resize events.
• Changed: Forwarding of data-* props is no longer supported. Use dataSet props, e.g., dataSet={{ 'some-key': 1 }}.
• Changed: Each component explicitly forwards supported props.
• Added: Pressable
• Added: View support for accessibilityValue.
• Fixed: Image support for variable resolution images (requires bundler integration).
• Fixed: TextInput support for onContentSizeChange to allow auto-grow textareas.
• Fixed: A limitation in setting styles using ref.setNativeProps.

Open canary issues

• Remove use of findNodeHandle in ScrollResponder
• Unit tests for PressResponder.
• Image loading doesn’t use a cache.

[necolas]

Closing as 0.13 is released

[necolas]

Latest canary 0.0.0-132218901. See OP for notes.

If there’s no further feedback by next week this will be going into master.

@EvanBacon for expo @paularmstrong and @comp615 for Twitter PWA @xcarpentier for react-native-gifted-chat @satya164 for react-navigation and react-native-paper