When you have to use one, which do you prefer and why?
React or Vue, or something else?
1 Like
If I have to use one I would use Svelte. I don’t write more than a few thousands lines of Javascript anyway so I like to use something simple. Alpine blurs the boundary between code and data too much for my liking.
2 Likes
I’ve used pretty much all of them, though not for too large projects. My personal conclusion is that, unless you have some specific product that requires a feature that only one of these offer, then it doesn’t really matter.
For the most part, except maybe for Angular(and maybe Ember?) they’re view libraries, so they’re just a templating system and some reactivity system to trigger view updates when data changes.
React and Vue have large ecosystems. Vue has always been a bit lighter(if we count react + react_dom) than react, but really it’s not that important. I’ve fiddled with React and Vue 2, I built a somewhat big Vue SPA, there’s nothing particularly weird about them(except the react hooks rules). Vuex was a pain in the ass, because at the time I didn’t really understand the problem it solved and everybody was hyping redux like stores. Lesson learned there. They both performed very badly in my low end phone. I’m not 100% sure if it was because of the framework or because of my mistakes, but switching to custom elements and doing stuff myself solved it for the most part.
Svelte has a compiler to “optimize” the code and “reduce bundle size” and “gain speed”. The truth is that not using a Virtual DOM approach is not a benefit per se, libraries like Inferno use VDOM and perform better in a lot of cases. Bundle size is amortized for small projects, but if you have lots of components then the promise of “vanishing js framework” starts to break. It’s fast and excellent, but not the fastest. Still for a lot of use cases I’m unsure if this is a useful benchmark.
Solid is another library that recently reached v1.0, it’s compiled as Svelte, but faster, and Ryan(the author) is a very nice person. The api is very similar to react hooks, but the reactive system is far better. If you know the Meiosis pattern or RxJS, it has similar ideas. If I were to use one today, I would probably pick Solid, because of Ryan and because it uses similar ideas to the ones I’ve been playing with in the past.
Marko is a framework by the Ebay people, it’s able to do SSR, streaming and a lot of the stuff React now presents as shiny new but since 2014. I’m very interested in it but didn’t have the chance to use it.
Then you have the Browser, you can use the Custom Elements API and write components that render using something like Lit or uhtml, but this is more of a DIY approach. I love this approach, but I understand some people just want to use a full blown framework.
I’d love to give a recommendation but after using a lot of them I realised that the complexity comes from building UIs, not so much from the frameworks themselves. People have built awesome stuff with all of them.
16 Likes
Is this a compliment? I am not a native English speaker, so I am not sure what you mean 
Wow, great experience and a nice reply. You should write an article about it. Thanks a lot for these insights.
i will take a look at Solid. I have heard about it a few months ago but haven’t explored it any further.
Haha, My fancy English tricked you. I prefer data stays data and code stays code, therefore I don’t like Alpine.
1 Like
Solid is new(actually in development since 5 or 6 years ago), so please keep in mind it has a small community and you’ll be in a similar position to using Elixir or Svelte some years ago, expect to do stuff by yourself instead of using component libraries. If you already feel comfortable writing vanilla JS then, as usual, it won’t be an issue.
I guess my takeaway here is, from these I listed, pick the one you feel most comfortable with and that makes the most sense for your project.
1 Like
Alpine JS is my go to for now
2 Likes
I am uncomfortable with all of them – because it’s JS. 
What do I do then?
Seriously though, golden post!
4 Likes
clojurescript and shadow-cljs for the rescue 
3 Likes
So how about LiveView with Custom Elements?
After reading your piece I checked and lo and behold a nice guy named Chris Nelson at Gaslight wrote a blog post about pairing LiveView with custom elements + Lit.
In the post Chris writes about connecting LiveViews to Custom Elements via the Custom Events API, and the good folks at Gaslight even maintain an NPM library for this:
7 Likes
I used that approach myself 
At some point it would be very nice if LiveView supports custom events out of the box(as well as having handleEvent renamed so it doesn’t conflict with the event listener interface I like so much to avoid binding issues), but I used that exact same I approach and I would 100% use it again. LiveView and custom elements are awesome.
2 Likes
I am using ClojureScript again these days and I’m loving it. Reagent/re-frame would be my go-to framework there. I recently mixed ClojureScript and LiveView and so far I am liking the experience.
4 Likes
lit-html
While similar on many aspects, I find React to be much more convoluted (and thus requiring much more glue code) than Vue.
For different reasons (mainly smaller bundle size and the compilation step which handles most of the glue code for you), I prefer Svelte now. Going from Vue to Svelte was easy!
3 Likes
A blog post on this would be greatly appreciated by many, I am sure.
3 Likes
I’ve tried most but tend to stick with straight, vanilla JS these days. Yes it’s not reactive, it’s a bit more verbose compared to something like Alpine but it’s always the same between projects, there’s no complex build chains and it’s easy to ship tiny amounts of it, particularly with LiveView doing any heavy lifting.
3 Likes
I’m old school so if site wouldn’t need to be “app” like and would only need small amount of interactivity I would just use jQuery or vanilla JavaScript. If web site was more like an app I would use Svelte. If I could use Elixir and Phoenix LiveView met all requirements for the project then I would use it.
3 Likes
I very roughly explained the process here: ClojureScript + LiveView - Backend Chat/Discussions - Devtalk but once I get to work more on this and address some rough edges, I will write a better looking post about it.
tl;dr
A PR that documents the process - Move to clojurescript by code-shoily · Pull Request #2 · code-shoily/miles_to_go · GitHub
A repository with LiveView hooks with ClojureScript (widgets: Line Charts, Pie Charts and Heatmap via PlotlyJS) - GitHub - code-shoily/covid19: A Phoenix app to display Novel Coronavirus (COVID-19)
9 Likes
Super helpful, thank you!
1 Like
