Solidjs and RxJS compatibility
Introduction:
Hi! I’m new to Solidjs and I like that idea where it’s similar to React and does not re-render the entire component for no obvious reason.
I came from Angular and React.
Since Solidjs does not re-render or re-executes the entire function/component, it’s so easy to use setTimeout/setInterval inside it.
Should RxJS also now be highly compatible with Solid? And the idea that we can use
onCleanup() to unsubscribe to observables or any other subscriptions.9 Replies
Welcome to our discord, John! While we do have tools like
from and observable that allow a seamless integration of RxJS, Solid's reactivity is sufficient for most cases.
The problem with RxJS is that it is truly excellent when it comes to mapping complexity into code, thus it becomes easier to write complex code than to reduce complexity. However, the former approach makes applications less maintainable. So we try to restrict our use of RxJS to those cases when complexity cannot be avoided.Thank you Alex!
For example I want to have a global state that can be accessed by all components. In Angular, I use BehaviorSubject from RxJS.
What will be the equivalent for Solid in this scenario?I can only see the Context can be used as an approach, but it seems when I have multiple context, it could lead to multiple nested context tags.. e.g. And if I try to implement a global context, it seems that it may bloat the file and mixed all the states where we could group them. Or am I missing something for sure. I’m still exploring…
Solid's state is not necessarily bound to context. You can define a global store. Only effects need to run inside a reactive root, but you can create such with createRoot.
If you need to manage multiple contexts, you can use https://github.com/solidjs-community/solid-primitives/tree/main/packages/context#multiprovider
GitHub
solid-primitives/packages/context at main · solidjs-community/solid...
A library of high-quality primitives that extend SolidJS reactivity. - solid-primitives/packages/context at main · solidjs-community/solid-primitives
This is a community primitive created for that use case.
Oh I think this is what I’m trying to look for. Finally, quickly found it with your help. You’re a life saver!
Just one last clarification, based on screenshot below (which I saw from the github link provided), this is just meant as static structure, but the states internal in these contexts is dynamic and can still change its values.
Like example multiple context has its own createSignal or createStore.
Is my understanding correct?
Yes, it is.
As long as the signal is defined, there will be no problem. There's only a problem if you tried to use this to dynamically enable and disable providers.
Alright. Thanks for helping me find this documentation!
Happy to help.