React Native community package compatibility

[jonstuebe]

What's the idea/story behind how folks can use React Native community packages? Currently, with react-native-web, most React Native community packages have additional "web" support based on those APIs since they share components like View, Text, etc. When transitioning to react-strict-dom, is the idea for those community packages to switch to using react-strict-dom for all of their code? Or will there be an abstraction on top of react-strict-dom that acts as a layer so that folks can use various React Native community packages on the web?

[necolas]

Packages rendering UI to web have to use RSD exports, not RN exports

[LunatiqueCoder]

Hello. I was wondering what would happen if we use RNfW elements alongside with RSD elements without compat API? I'm mostly worried about gesture handler and reanimated.

I can see in the example app, there's RSD elements nested directly inside a <ScrollView /> imported from react-native:

react-strict-dom/apps/examples/src/components/App.js

Lines 11 to 12 in 6dc2762

	import { ScrollView } from 'react-native';
	import { css, html } from 'react-strict-dom';

react-strict-dom/apps/examples/src/components/App.js

Lines 147 to 148 in 6dc2762

	<ScrollView>
	<html.div style={egStyles.div}>

[MoOx]

I am thinking about trying RSD on a new project, but yeah I am questioning myself with things like SVG or animation.
I really enjoy react-native-svg and react-native-reanimated even on the web.
For SVG, I guess rn-svg is just throwing svg web components under the hood, so we should be able to use react-native-svg without any issue. But for animation, I am wondering what would be relevant...

[LunatiqueCoder]

@MoOx We tried react-native-svg on web and it bundles a lot of useless javascript code. Plain HTML is just better.

[MoOx]

Yeah but then your code isnt native compatible 😅

[LunatiqueCoder]

Platform specific files do the job for now (.native.ts, .web.ts) and we do our own abtraction, until a better one will be available in the community (perhaps based on RSD)

EDIT:

React Strict DOM <svg> support in progress:

• Implement <svg> support #272

Reanimated CSS animations:

• https://docs.swmansion.com/react-native-reanimated/docs/next/category/css-animations/