What's advantage of VueJS over Svelte ?
I can't stand Vue (but haven't tried newer versions).
The reason is that Vue is miserable to debug in the browser. It is really clever to use proxies for values but then you have to make an extra click to see the actual value and it really slows you down. Recreating the state of the app inside your head can't be done quickly because you have to manually evaluate everything you need to do that.
Vue also uses it's own DSL that generates a bunch of code under the hood, which confuses the browser.
These things could have changed in recent versions of Vue but I had such a poor experience that I would never go back.
I had to respond to this comment because the reason you have fewer libraries for Svelte is that Svelte is just JavaScript. It is trivial to use any JavaScript library because it requires no integration wrapper to convert that library to Svelte. Just use it as you would without Svelte. It's a much better experience than Vue or React can ever give you.
With https://chrome.google.com/webstore/detail/vuejs-devtools/nhd... ???
Does this work on Firefox, I recently switched to that?
The React extension was/is great, I assume this one for Vue is as well. But, it wasn't there when I was doing Vue and the out of box experience of Vue was not good because of it.
I wish people would stop saying things like "is just JavaScript". All these frameworks do fancy things with JavaScript, and they're all just as much JavaScript as each other. Also they _all_ use DSLs; Vue, react, and svelte.
I would argue very much against that: Svelte looks like Javascript, but behaves completely different. I don't think it's a bad thing, and quite enjoy it, but I don't think it's valid to call a language that happens to be valid JS syntactically actually JS.
> It is trivial to use any JavaScript library because it requires no integration wrapper to convert that library to Svelte. Just use it as you would without Svelte.
What do you mean by this? Of course you can use a standard JS library with any other framework! What makes Svelte different here?
No. This is complete and absolute FUD that you are spouting. Svelte adds a thin feature or two on top of vanilla Javascript. The rest is just JS exactly like you know it.
You can see what Svelte creates inside the tutorial. It's very simple JavaScript.
With React or Vue, you are pulling a bunch of stuff written in a DSL into their massive runtime. Try keeping all that complexity for that runtime in your head.
All JS frameworks are just Javascript. What else would they be? The templates however are all specific DSLs, whether it's JSX, HTML with directives, or Svelte's own syntax. In the end these template just get compiled into a JS render function that takes in data and returns an HTML structure.
JSX is not JavaScript. React builds an entire system hidden from you that isn't the way JavaScript runs.
What abstraction are you thinking in? With Svelte I'm thinking in JavaScript. With Vue and React I'm thinking in hooks-land or whatever, and trying to understand a completely different virtual machine. There are some really brilliant ideas they have come up with, but the whole cloth experience isn't for me.
Vue is worse. Create an item inside the data attribute. Somehow that becomes available to computed functions. Somehow you can have that data attribute rely on parent attributes. None of that is the way JavaScript works without Vue on top. I'm so glad I don't have to remember those rules anymore.
You are correct they just compile into render functions. But the one Svelte produces is readable and the ones produced by Vue and React are a lot less so.
Anyway there is no other abstraction. Hooks and composition APIs aren't magic, they're functions that you can write yourself. It's basic property change notifications but wrapped up in various levels of automation. Vue's object API can definitely seem messy but the new composition APIs in Vue 3 is standard JS syntax. Maybe it would be helpful to see the code yourself: https://github.com/vuejs/vue-next/tree/master/packages/react...
(This is a complaint about React, but...) I really find hooks/effects to be pretty magical. Keeping track of how many times a hook/effect runs is really difficult for me. It looks so simple at first, but there is a lot going under the hood to figure out how often they run.
Vue can also use the html as the component template like angulajs 1 used to allow. This makes it great for progressive enhancement and plays nice with server side based template frameworks.
Bottom line, vue scales up, but also scales down. You don't need to go full spa, you can hack a quick demo or make a one file tutorial and it's a bliss.
Also, maybe I missed it, but I don't think svelte has the concept of cached properties.
This is actually the biggest selling point IMO. I used Svelte instead of Vue purely for speed, but the benchmarks suggest Vue has made real progress here. Though, I'm not sure that in real applications a virtual DOM solution could ever be quicker than compiled code to update state. But in terms of developer UX, I think Vue has the easiest entry point, and it seems to have decent performance to boot
I know about real world projects that use Vue as a progressive enhancement on an existing PHP site. A weather card is, for example, being managed by Vue with it's reactivity engine.