search

dai-shi / react-native-dom-expo

[NOT MAINTAINED] A patch library to make Expo work with react-native-dom
MIT License
26 stars 1 forks source link

Support SVG #9

Open dai-shi opened 5 years ago

dai-shi commented 5 years ago

Since "web" version of svg doesn't work, we need to wait for react-native-svg to support "dom".

https://github.com/react-native-community/react-native-svg/issues/945

dai-shi commented 5 years ago

Well, I implemented by myself. It was way more difficult than I first expected. The major remaining issue is event handlers.

dai-shi commented 5 years ago

@dutzi Probably, you want to try it.

msand commented 5 years ago

Very interesting approach. There's also a web version of react-native-svg now.

msand commented 5 years ago

https://github.com/react-native-community/react-native-svg/pull/950

dai-shi commented 5 years ago

Hey, thanks for coming here. I'm aware how Expo made react-naive-svg work in RNW. Unfortunately that approach doesn't work in RND. RND uses two threads, and the worker thread can't touch DOM...

msand commented 5 years ago

I'm still thinking that it would be easier to map the input props which are coming to react-native-svg to dom in the render(?) thread of RND, than mapping the native properties we're giving to the android and ios native view implementations.

That is, replacing the Tag/type in the jsx ( a bit like the serialization example here: https://github.com/react-native-community/react-native-svg#serialize ), or defining new components which don't transform the input props and styles at all, just pass them over from the worker to the renderer. As we aim to conform as close as possible to the svg support in react-dom/web.

What are the constraints on communication from the worker to the renderer? I haven't looked into RND in detail yet. I would assume it sends json like setNativeProps, or does it allow full Worker.prototype.postMessage?

dai-shi commented 5 years ago

First of all, I might be mistaken. As far as I understand, in RND we provide a native view implementation like android and ios. Most of JS code runs in a worker thread, and UI dependent code runs in a main thread in RND that is like mimicking android and ios. RND doesn't modify RN code, I assume. I don't fully understand your suggestion, but probably that modifies the RN code in react-native-svg, which is something I never thought, so there might be a way.

I agree that my current approach is kind of disaster, so definitely desire a simpler solution.