DEV Community 👩‍💻👨‍💻

Discussion on: Why SolidJS: Do we need another JS UI Library?

isaachagoel profile image
Isaac Hagoel

Hi Ryan, huge respect for you and your work. While you make fair points about Svelte (and the other frameworks), I think that the performance and small bundle size are not its main selling points. They are a nice bonus and a way to insult React but as you say, there are frameworks that optimise better for that, Solid is probably the leading one.
The main thing with Svelte, imo, is how elegantly and straightforwardly it lets one express concepts that would be quite painful using other frameworks, like React. I guess it is thanks to the compiler (which turns the .svelte files into something that the browser can understand) and a very good API design.

I am thinking about built in but easily extensible transitions and animations, custom actions, reactivity that requires almost zero syntax, bindings to stuff that aren't normally bindable (like dimensions of stuff), stores and the way they can be combined with actions, the way it utilises custom events etc. It somehow feels very high level and very low level at the same time. Unlike React Hooks, it doesn't make it easy to shoot yourself in the foot with stale closures, infinite rendering loops, out of control effects and such.

Not saying it's perfect, it has bunch of weaknesses, most notably around what can be done with 'slots' and styles.

ryansolid profile image
Ryan Carniato Author

Svelte has done some really transformative things with its compiler. I was sort of hesitant even publishing this piece since I knew how subjective a lot of this stuff is. I think that experience you talk about is a big part of what attracts people to libraries. I know that I have gone from one end to the other in this regard and I still have admiration for different extremes. I actually joked a couple of weeks back that with the power of reactivity and compiler maybe I could emulate any libraries experience. I was imagining use Solid and JSX with a compiler preprocessor to basically mimic Svelte's API experience or React's. Svelte is just JavaScript executing DOM operations like everyone else.

I think some of the syntax Svelte uses is really powerful. And I've been considering how to use JSX namespaces to offer similar syntax for a different sort of directive extension. I think Svelte does a lot of things very well. My personal preference is to have more transparency on behavior and more extensible composition patterns which is why I stand by the importance of embracing the knowledge of reactivity, since even Svelte has to break that wall once it gets out of Components for things like stores. It's a philosophical thing that Svelte and Vue sort of have in common. They want to ease you in with familiar experience and grow you into more advanced things as holes in the abstraction appear. I don't have any particular issue with strength or weakness of features here, but more the philosophy.

React gets a lot of flack because it is basically always what you see is what you get. Here are the tools just do it. It doesn't attempt to tell you what to do or how to do it. Just these are the pieces you should need and they are always the same. Ultimately I learned to love React more because over time I just naturally got to the same conclusions despite years of fighting it. I'd rather have a few adaptible but powerful simple tools than progressive layers of experience. If you are going to get there anyway, why not start there with a tool that has set its focus in that zone. I agree the Hooks abstraction has issues, which was really the reason I pounced. But this explicit transparent approach gives more control and I appreciate that control. I noticed that for some reason no other reactive library had come to the same conclusions. And I think it came down to them seeing Reactivity as a user ease feature. I see it as the ultimate building block to construct optimal interactive interfaces. So right off the bat my goal was much more aligned with React's.

So maybe that is how I should sum up this whole article:
Solid is to React as
Svelte is to Vue