Example code/docs on interoping with other libraries/frameworks

[btakita]

I have some large sveltejs projects with large components. I'd like to introduce Solidjs to more easily decompose the large components into tsx functions. Are there any good examples of embedding SolidJS into another library? It can be generalized, accounting for the compilation, dom/ssr rendering, reactive event wiring, signals, hydration, cleanup, etc.

Svelte kit, next.js, vuex are all powerful PWA libraries. Until Solidjs has a similar project, it may be useful to wrap Solidjs within one of these projects.

[ryansolid]

Client only in theory is probably pretty simple and similar in most frameworks. You get a ref and call Solid's render function in the suitable place according to the framework.

But generalizable is hard. SSR has other constraints depending on how the host works. VDOM, strings etc..Building might be ok but like Solid and React both having JSX would be a dance. Have you ever seen examples of docs like this before? I think there are a lot of pitfalls and it would take doing the integrations and writing detailed guides for each.

[ryansolid]

Yeah I don't know what to do with this one. I could have a better example around using refs to import 3rd parties but the other side is really wide open and not particularly easy if even possible. I will leave this open to gather some feedback but I don't have any plans for the moment.

[btakita]

As discussed in the Help channel on discord, In the case of Sveltejs, it would be useful to have analogs to some of Svelte's concepts such as bind: being something like use:bindAttribute=['value', getter, setter]

Also, helper functions for interoping between Solid Signals & Svelte stores would be useful. Each library combo can have its own set of interops.

[ryansolid]

Yeah I see separate packages being built for these cases. I think the contributors would need to be intimately familiar with both frameworks to do this and up to date on the latest in each of these frameworks. I'm sure there would be some people in this scenario that could really benefit from this and also be the best people to maintain the effort. I haven't seen libraries like this before as I said earlier so I don't know if there is any precedent but would look forward to supporting anyone willing to prove it out.

[ryansolid]

I don't really have much in actionable items here. Solid won't integrate with existing meta frameworks directly. And interopt points with libraries depend on each library. I've seen some interesting solutions to the problem like: https://www.npmjs.com/package/react-solid-bridge

And I made these:
https://codesandbox.io/s/solid-react-hoc-8m2yd
https://codesandbox.io/s/react-solid-hoc-5lmt2

But I'm leaving it here. This is just beyond the scope of the core project to maintain I think.