Hacker News Reader

Comment by hoodoof | Hacker News Reader

Can someone explain the appeal of Vue over React?

Vue doesn't force components or build tools on you. You can drop it as a 30ko script in an html tag and put the template in the html file for small projects, then go full webpack + components as it grows.

Managing state is very natural on small projects, but you can use the official, well integrated store.

The doc is stellar. The api is simple, with no surprises, and riddle with small helpers to make your life easier. As a result, reading the official tutorial feels like a friend is talking to you.

Debugging and training are easy.

I do mostly react for my clients, but when i can choose, i always go for vue.

As someone who uses Vue every day at work I would not say that Vue has a simple API, though it has many conveniences.

I think a fair comparison would be to look at React's component API: https://facebook.github.io/react/docs/react-component.html

And compare it with the Options / Lifecycle Hooks and Instance Properties and Instance Methods sections of the Vue API docs: https://vuejs.org/v2/api/

Vue may be simpler if you have passing familiarity with Angular 1, or if you are very familiar with Mustache-style templates. But I think it's wrong to say the API is simple, or has a small surface.

The naming all life cycle methods, the grouping of things by categories in data, methods, all the things you don't need to learn to make jsx do what you want, the whole props/callback things that is vastly simpler, no set state shenanigan, no two ways with consequences of creating components, the use of standard html attribute names and not js dom api names, etc.

That makes manipulating the api way simpler for me.

> The api is simple, with no surprises

There are surprises. Reactivity with child components, and how to deal with that - there's enough "this isn't what I was expecting" that I run in to a lot in the forums that it's certainly a "surprise" to many.

> Vue doesn't force components or build tools on you.

Neither does React. Both components and JSX are optional, you can just build a vdom out of function calls.

Simpler. Have standard router, Vuex store, so no need to choose which router to use, Redux or Mobx etc. Compatible with web components. Standard way of creating plugins/middleware and project templates. VueJS is more of a framework than React's view component. No 'concern' over the licensing. Use JSX or not is up to you. Smaller size. My bet is VueJS is likely to be the next JQuery. I switch from React and life is better.

1. Template syntax instead of JSX, the latter being unfamiliar and initially off-putting to many.

2. Two-way data binding. Convenient, no need to write handler functions.

3. Comes off as a better version of Angular. Appealing if you're familiar with Angular.

4. Comes off as more curated than React with regards to e.g. routing and state management, less need to shop for libraries.

5. More performant in some situations.

That said, I prefer React. I consider 1 and 2 drawbacks of Vue compared to React.

Just a nitpick, but you can use JSX in vuejs : https://vuejs.org/v2/guide/render-function.html#JSX

But how is the JSX story in Vue? Every time I ask this I kind of get crickets, because it seems just about everyone is using the default template syntax.

I agree. JSX is supported but in my experience, very rarely used.

Two-way databinding is not supported by Vue 2 if I remember correctly. You can do it, but you'll get console logs, about how you should avoid doing it.

Two-way binding does exist, just not in the same problematic way it existed in Vue 1. It was changed to just be syntactic sugar for the event handler approach - https://vuejs.org/v2/guide/forms.html .

It seems to be supported in Vue 2.x to me: https://vuejs.org/v2/guide/forms.html

It's like if you took Angular 1 but made it more template based and gave it the performance of Angular 2 without having to compile your code.

Also you can avoid using JSX (although it can be used if desired)

MIT licensing without weaponized patent clauses.

https://medium.com/@raulk/if-youre-a-startup-you-should-not-...

A small factor but a big one imo is that vue-cli is an infinitely tidier affair than create-react-app. It's very easy to get through your first few apps and tutorials with Vue because they're usually following the exact same base.

Vue DevTools (with Vuex support) is a much more pleasant experience than React/Redux Dev Tools as far as Chrome integration goes too.

Look how Vuex - which is an equivalent of Redux, but for Vue - is implemented. Comparing to Redux it's much simpler.

I would suggest to visitors to Vue to not dive into using something like Vuex unless you really know need it - IMO it's not at all a 'by default' library to bring into a Vue project.

Give a try using only props and events. You will save a lot of typing and brainpower avoiding actions, mutations etc. I work on a fairly large, at this point, Vue application, and I am pleasantly surprised how far we've gotten without global state stores.

If you need a global event bus, you can just use vanilla Vue to get quite far as well - https://vuejs.org/v2/guide/components.html#Non-Parent-Child-...

Agreed. I looked at Vuex and it seemed unnecessarily complex for most projects. We just have plain state objects that get passed to components that need them, and a convention that components call methods on the state rather than modify its properties directly.

Simple and easy to use. Official vue-router and vuex (centralized state management) libraries are excellent.

Reply on news.ycombinator.com