Jonathan Stiansen

Very occasional posts at jonocodes.com - loves functional programming, love shiny things.

Nov 24, 2015

@DanJavia I just want to step in, though I don't usually feel I have anything to add.

React and Vue are very different ways of solving the same problem. From my looking at Vue.js it is a very different model of solving the UI problem. It's 'reactive' in a different way that React. I'll explain more below (based on my short lived impression.) Vue looks like Blaze which is Meteors templating engine (which I believe can be used on it's own). meteor.com/blaze

React tries to bridge the gap between Functional Reactive Programming and normal Javascript - which is good. It aims to reduce the amount of 'touching the dom' that is done, and it aims to be traceable and easy to reason about. My bold claim: This just can't happen when you can change state whenever, wherever - which is what Blaze and Vue enable.

Vue doesn't have that as a goal, I'd be interested in hearing Evan respond if he's interested. I think one of the main pulls of reactive programming is 'it just works' and it responds to data changes immediately. I believe this requires 2 way data binding which can be slow, which Evan disagrees with - but either way he can't argue that it's harder to debug and reason about.

After all that, my issue with Vue is: why would I use it over Meteor? - Reactivity is great, but you have to define a good enough API which also supports it. Meteor is tightly coupled to it's UI framework (for good reason), and the best non-coupled frameworks I've seen are Falcor, and Relay (for reactive programming). Both are Node JS frameworks - so why not just go with Meteor, take advantage of it automatically making your Javascript Asyncronous and take advantage of it's write once run everywhere model of programming.

Or have an easy to reason about front end, using react and some version of flux (because once you understand the paradigm it is the right way to go). Then use some API you create, or use Relay or falcor to do the server fetching.

React has a lot of awesome optimization that most people don't know about. You are not comparing apples to apples by looking at the library size. React is as battle proven as any framework, Facebook and Netflix are using for (I believe) all their front ends. Vue isn't. To be convinced Vue is a good model, I'd need to see:

* Some perf testing between Vue.js and React with very large Dom trees > 10,000 elements, both with few changes and with lots of changes
* Specific use cases it can handle - which are not fixed better by meteor

Let me finish with a thank you to Evan, I really appreciate you putting time into building a cool framework - I really am not trying to put you down. I'm just coming at this from my personal point of view - if you have some suggestions with better ways to critique let me know :-)

Vue isn't opinionated on how you manage your state, nor does React itself. You need to realize that the preference of leveraging immutable data is what the React community has been pushing for, but not something baked into React. That's why there needs to be Flux (and its 1024 different implementations). If Facebook didn't promote Flux as the go-to pattern for building larger React apps, I bet a ton of people would still be using setState() everywhere today - which is essentially mutable state inside the component.

On the other hand, Flux patterns can be applied to Vue too. Optimizely has been using NuclearJS (their Flux dialect) with Vue since Vue's early days. Redux is also view-layer agnostic. You can use it with Vue no problem, because you can build your Vue components as dumb, purely prop-based ones and just shove a new state tree from the root. Granted you need a bit more discipline (e.g. not mutating state retrieved from stores), but similarly in Redux you need to refrain from mutating state in reducers too. If you want to go the immutable way, it's just something you have to enforce as a rule. The general claim that "React makes your state easier to reason about" is superficial and not addressing what actually contributes to it, and in my opinion shows how many people are just chasing the latest fad without really understanding the details.

As for comparing Vue vs. Meteor, that sounds completely off the mark to me. Meteor is a fullstack framework. Blaze is just part of Meteor. If you go with Meteor you have to adopt the entire stack, all the way to the database. Vue is just the front-end. In fact Vue doesn't even care about how you fetch data. You can use Vue with Meteor as a backend. You can use Vue with Laravel. You can use Vue with Falcor. Would you use Meteor with Laravel? The comparison simply doesn't make sense.

If you are interested in enterprise usage, sure Vue doesn't have super high profile usage in US like React does, but it's used in production by some of the most dominant Chinese tech companies: Alibaba, Baidu, Sina Weibo, Xiaomi... in particular, Alibaba used Vue for its mobile channels during the Singles' Day sale (think Amazon during Black Friday).

Finally, in terms of performance, Vue is a bit slower than React for startup but has better runtime performance and is easier to optimize for than React. There are some simple benchmarks out there, but if you are really interested into the details, listen to this JavaScript Jabber episode - the performance parts are near the end.

Search Hashnode