Using Solid for apps with large/complex states
Is Solid advisable for creating interaction-heavy apps as complex as figma/canva? The high-performance nature of Solid appealed to me, but I'm not sure how to manage extremely large states with Solid. How do solid signals scale?
4 Replies
Signals scale extremely well, but they themselves are not fine-grained. So for objects and arrays, Solid has stores, which creates Proxy objects that are internally powered by signals, but allow for fine-grained reactivity.
So when you design your state, you should ask yourself which parts can be simplified into things less or equally complex as a string and put those into signals. Then, use stores for the complex parts. If you need slices of stores, you can also wrap stores in stores for better control of who can write what.
Even so, there might be occasions when you need an object with only one level of reactive properties that need to be more performant than a store. The solid-primitives project has got you covered then: https://github.com/solidjs-community/solid-primitives/tree/main/packages/static-store
GitHub
solid-primitives/packages/static-store at main · solidjs-community/...
A library of high-quality primitives that extend SolidJS reactivity. - solidjs-community/solid-primitives
@Alex Lohr thanks for the comprehensive answer, this is pretty clear -- so in terms of speed: Signals >> Static Store > Store, the tradeoff being the complexity of the data stored in them. So the principle would be then to lean towards simplified/isolated state as much as possible, then only go to Store when absolutely needed
Will give this a try -- hoping I can ditch the usual react/redux stack. Thank you!
happy to help 🙂