11 ms·
Anyone moved from React to Vue. I've been reading the Vue docs and I like some things about it but the compositional model seems a bit more confusing compared t
by mouzogu 5y ago
Anyone moved from React to Vue. I've been reading the Vue docs and I like some things about it but the compositional model seems a bit more confusing compared to React.
Also, I think I do prefer working with JSX versus using html templates. I prefer that close coupling of JS logic and JSX presentation.
The most appealing thing about Vue is that it seems to be more of a framework, maybe somewhere in the middle between base React/ReactDOM and Next.js.
- Rodeoclash 5y agoI moved to Vue from ~3 years of React. I've now done ~2 years of VueJS while continuing to use React in some side projects. To be quite honest, I'd probably stick with React if given the choice. My takeaway with Vue is it makes a number of choices for you out of the gate w.r.t to things like data store (Vuex) and routing (Vue-router) whereas with React you'd bolt these on yourself (i.e. mobx and found-router). I also feel like Vue gives you many more opportunities to shoot yourself in the foot in weird and wonderful ways. For example, you can access the instance of a parent or child component without too much trouble whereas React does seem to go out of its way to prevent this. React has a few quality of life improvements too, things like hooks (which may be in Vue now? Not sure) and being able to have components with multiple children at the root.
- CodesInChaos 5y agoIf you've only worked with vue2, I'd give vue3 a look. I like the new composition API a lot. > you can access the instance of a parent or child component without too much trouble $children was removed in vue3 https://v3.vuejs.org/guide/migration/children.html https://v3.vuejs.org/guide/migration/children.html > things like hooks Vue doesn't have react style hooks, but the composition API fills a similar niche. > being able to have components with multiple children at the root. Vue3 seems to support this: https://v3.vuejs.org/guide/migration/fragments.html https://v3.vuejs.org/guide/migration/fragments.html
- preommr 5y agoFunnily enough the reasons you gave are the reasons I like vue and dislike React. I like de facto solutions instead of half-baked libraries that might have slight incompatability issues. I also like the freedom and flexibility that vue offers rather than the weird guardrails that come with react.
- ibdf 5y agoThe CLI literally gives you the option to add vuex and vuerouter but it doesn’t force you to. You can use whatever you want or not use these options at all. You can access the instance of parent or child but it also recommends you to use props and emits so that you don’t shoot yourself in the foot.
- kiawe_fire 5y agoI work about 80-90% with Vue 2 and 10-20% with React, so take this with salt. But, with React, I rarely find myself wondering why the component isn’t re-rendering when something changes, whereas this happens frequently with Vue. I also rarely find myself having to plan out how props will flow to state or when something needs to be a computed (or memoized) property. Things usually just kind of come together. There are several reasons for this, but often times it comes down to either doing the wrong type of assignment that makes Vue lose its wrapper object around the property, or something to do with the way I use props as defaults for reactive state. Which leads to another complaint - mixing props passed in to the component in the same space as the reactive state. This means the property needs a different name from the state property that it drives, it means having to mentally track which piece of data can be mutated because its state and which cannot because its a prop, and it often means wondering why your component isn’t re-rendering when your prop changes, only to finally realize you really need a computed prop or a prop watcher. I don’t want to sound overly dramatic though. It doesn’t happen every day, it’s never prevented me from doing anything, and Vue (IMO) makes up for it in other ways like single file components with better styling options. It’s also possible I just haven’t used React enough. But that said, in my experience, some of Vue’s magic that makes it simpler to get started with, is also what makes it trickier to work with as projects get larger. Disclaimer: Vue 3 introduces hook like things that I haven’t tried, and perhaps make my complaints less valid.
- stevage 5y agoI, similarly, work about 90% with Vue2 and 10% with React. I have a different experience though. I generally find React pretty mysterious, with very confusingly named methods, and several generations of approaches that are completely different from each other. (React Hooks changes everything...) I used to occasionally find situations in Vue where something wouldn't re-render, but that almost never happens anymore. The main culprits are when a component never gets mounted (because it's in a v-if), or expecting reactivity before it gets mounted. I hate the clumsiness of React, the lack of "methods" and simple event handlers, the need to be overly verbose everywhere. I almost never use Vuex, fwiw. I find both Redux and Vuex (which apes it) are an incredibly complicated solution to the problem, and wish there was something simpler.
- andeee23 5y agoI've used both extensively and what makes me lean towards Vue on new projects is the reactivity system. It seems that with React you always have to wrestle with it to not do too many re-renders, but Vue is more likely to update only the parts of the dom that need updating out of the box. With composition API and Vue 3 bringing typescript support and hooks to me it's a no brainer to choose Vue. One other thing is that I've seen people who are normally doing only backend pick up Vue in a day or 2, but React takes longer to grok. You're probably likely to find more people who have already learned React than Vue though, due to its popularity. React also has a bigger community but I haven't felt that I was lacking when looking for Vue libraries.
- mouzogu 5y agoI agree. The reactivity system is definitely less verbose in Vue compare to React. And when you start working with things like Redux it gets very layered and complex very fast.
- kall 5y agoI feel the exact opposite about the reactivity. React is: always right, sometimes slow Vue is: always fast, mostly right I prefer fixing performance bottlenecks later over having any doubt about the correctness of my view or debugging why this one property only sometimes becomes reactive. But I can see how others would feel differently.
- midrus 5y agoIn my experience those optimisations tend to never happen unless they make the app unusable, leading to tons of WebApps working like crap.Probably you work on a company that budgets a lot to eorgormsnce optimisation, etc or you just care a lot about it, bit in my experience most companies and most developers don't have the time or motivation for it. I'm tired of sluggish crap.
- manigandham 5y agoAll Javascript UI frameworks are the same. They provide a way to build UI and interactivity using components, and are powered by the same functional flow of data -> render components -> trigger event -> change data -> repeat... Once you get past the fundamentals, it's just choosing the features that you like better. Vue uses HTML-based templates by default which I find better for 99% of scenarios, and can also be generated by a server-side framework which makes it easy to integrate into existing webapps without rebuilding as a complete SPA. Reactivity is another thing that all frameworks and state management as evolved to, since it's just automating what you were manually doing anyway. Mobx and the like were early versions but the composition API in Vue 3 is probably the most polished version of this with automatic tracking that does what you expect and intuitive effects/watchers. Vue also has official projects vs the 'unofficial' official ones for React, but that's a purely subjective preference at this point.
- jfbrennan 5y agoAgreed. I think HTML is great and JSX is an abomination. I also don't need literally 69 ways to do CSS in my React components. So, I prefer Vue SFC.
- imedadel 5y agoI recently started working with Solid [1], it's like Svelte for React, and it's way faster than both of them. It has the same JSX syntax and very similar hooks to React. The only problem is that you will find yourself porting many React libraries since Solid is quite new and doesn't have as a big of a community. [1]: https://www.solidjs.com/ https://www.solidjs.com/
- PYTHONDJANGO 5y agoAnd when you started porting libraries, why did you not start to wonder if that is the right way to go?
- pbowyer 5y ago> Anyone moved from React to Vue I'm considering a move in the opposite direction for a few reasons: 1. React Native. I can build mobile apps using Vue via Ionic Framework / Cordova / Capacitor but that ecosystem is a nightmare (esp the Cordova/Capacitor split). React Native has more extensions available and the camera related ones are considerably more featureful. 2. Libraries/widgets. Vue has widget libraries available and (multi)select fields et al work great. But when you want something more advanced - a decent calendar picker for example - I always turn up a React library that does what I want, and the Vue one doesn't. [I suspect there's compatibility issues if you use too many React widgets - gras is always greener etc] 3. Expectation that you know React. I've had clients say "we use Vue, do you know it?" but I've had 10x more say "We use React, do you know it?".
- SergeAx 5y ago1. Have you checked https://vue-native.io/ https://vue-native.io/ ?
- ianhawes 5y agoHave you checked Vue-Native? It hasn’t been maintained since October 2020 and IIRC doesn’t work with the latest RN versions.
- dhritzkiv 5y agoI don't use Vue-Native, but it seems to be undergoing regular, active development, with a release in July 2021.
- PYTHONDJANGO 5y agoIf you do not use it why do you feel you should comment about it?
- dhritzkiv 5y agoI don't use it, but based on my observations (i.e. looking at the Github repo), I can see that there have been several releases and continued significant development –not merely dependency updates– in the past few months. I was merely offering an objective correction to the parent comment's statement: > It hasn’t been maintained since October 2020
- wirthjason 5y agoI’m not a full-time front end developer, so take this with a grain of salt. I write JS frontends for my nights and weekends side projects. I chose Vue over React because it seemed easier to get up to speed. When I was looking to change jobs earlier this year I spoke with a lot of recruiters and they all said companies were looking for React developers, there were zero mentions of Vue. I don’t really regret my choice of learning Vue but React would have definitely been a selling point on my resume. Will this change in a few years? Who knows. It feels like it’s React vs everyone else and as more and more projects get built in React I suspect the difference will widen even more.
- pixelmonkey 5y agoWe chose Vue at Parse.ly after spending quite a lot of time building real-world web products in pre-SPA simple Django + jQuery (2012-2015), then Angular 1.x (2015-2020), and then React (a 1 year experiment, 2018-2019). We switched our main product to Vue last year, and we couldn't be happier. And, we advertise Vue in our job postings. And, we are hiring! https://www.parse.ly/careers/frontend_engineer https://www.parse.ly/careers/frontend_engineer
- tarsinge 5y agoFor me JSX vs HTML templates depends of your organization and workflow. If you’re a solo dev or in a JS heavy team, I think JSX can make more sense. HTML templates on other hand give a lot of power to non dev. It works well for our agency with our web designers, they can handle all the logic in the HTML, so much that on some projects no additional JS developper is needed.
- emn13 5y agoOne difference being that vue templates appear to be hard to make type-safe i.e. hard to benefit from type-checking, whereas jsx is syntactic sugar for JS, and supported by typescript. I'd rather have jsx, all else being equal.
- IshKebab 5y agoWe moved from Vue to React because it has much better static typing support. Properties are native Typescript values and templates are TSX which gives you proper Typescript type checking and also full IDE support (autocomplete, go to definition, etc.). Also Vue's automatic reactivity system is fine for small websites but for large apps it turns into an impossible to follow spaghetti nightmare.
- CodesInChaos 5y agoWas that vue2 or vue3? I believe vue3/composition API made some improvements in both of these areas.
- Bellamy 5y agoWhat about security and upgrading? I've heard there is some pain upgrading Vue, but there is definitely pain when upgrading React. At the moment one of our previous React projects "npm install" gives 4000 security issues.
- efdee 5y agoHaving used React for well over 5 years, I have no idea which upgrade pain you are referring to?
- fleaaaa 5y agoFor me, upgrading cost was almost zero except 16 but it was clearly worth it.. I think you chose an obsolete project, which could happen to any lib.
- Bellamy 5y agoI'm pretty sure you are right about this.
- jgrpf 5y agoReact might have stabilized in the meantime but a couple of years ago the upgrade pain definitely was there.
- fuzzy2 5y agoI have a small toy project (essentially CRUD for images + tags + descriptions) that has a React frontend, mostly old class-style components. Having rewritten this frontend using Vue 3, my impression is that Vue 3 with its Composition API is just a different flavor of React with function-style components and hooks.
- jgrpf 5y agoI switched some years ago and never looked back. What I really like about Vue is that I can use it with a build system or just add it with a script tag for a bit of progressive enhancement over a form. I think it is simpler and decreased my bug count. I'm mainly a backend developer though.
- 52-6F-62 5y agoI've largely worked with Vue 2 in recent years over React. Primarily moved just to try and reduce front end bloat, and stuck because I preferred some of the patterns—personally I found them easier to reason around than some of the popular React patterns. I really liked The Vue class component pattern. Localized styles, logic, and markup, coherent state management built-in. The tooling got more bloated in time, but it was still a breeze to work with. I'm now trying to catch up with React again as industry tends to dictate—so far so good, but I liked the "pure"/Vue-flavoured HTML markup approach of Vue over JSX. It seemed to have all the benefits of JSX a la close-coupling in class components, but saves the wonky half-flavour of markup/logic—especially when it comes to working in TypeScript. That said, maybe my tune will change after I spend more time in the React ecosystem again—especially trying to make more use of server-side rendering.
- kall 5y agoI primarily work with React but have done a number of Vue projects. It a great tool ä but I don‘t see any reason to switch, if you don‘t find react confusing. What I don‘t like: - jsx support is second class - composition is wonky (better in3?) - typescript is wonky (better in 3?) - automatic reactivity is less predictable than the explicitness in React - automatic reactivity on complex data structures is wonky - no more than one component per file - the "official" router is config based. I like the component composition of react-router What I like - way easier to learn for any previous web developer - vuex. I think global state libs are overused but if you need one, it‘s nice and it‘s great that you don‘t have to glue it to the framework yourself - significantly smaller and faster - can realistically work without a bundler directly in any html page
- jrsj 5y agoI’m in the process of making this move now because I know both well but I’m on a team of primarily backend engineers that want to be able to work on our front ends and Vue is much simpler to read and reason about in my experience. Fewer files, fewer new concepts, syntax closer to what you’d see with old school server rendered stuff. I don’t really care about 3rd party libs or React Native so it just makes sense. Overall I just have a strong aesthetic preference for Vue too. It feels clean and I have a higher appreciation for the quality of my work when I use it. React apps I work on always feel like they’re not quite “there”, there’s so many different parts that it never feels fully coherent to me.
- chris_st 5y agoI moved a few years ago to Vue, and particularly with Vue3, I'm more than happy I switched. > I think I do prefer working with JSX versus using html templates. I thought I'd prefer JSX too, but I've come to much prefer Vue templates. Turns out that, while it's nice to have the "direct" control, I prefer seeing a full context that the template gives you, rather than having a lot of broken up parts, like JSX. That said, it is slightly easier to refactor stuff in JSX.
- midrus 5y agoI'm in my first few months with Vue after 5 years of react and so far I'm loving it for the most part. I'd say the things I like the most are 1) More of a framework than s library (official router, state, css-in-js, etc) and 2) automatic tracking of dependencies. The worst part so far has been mostly related to the ecosystem. I find Next superior and better maintained than Nuxt, and the 2/3 transition situation looks like a really bad thing to me (sadly reminds me of the python 2/3 situation). Also, it might have been caused by the specific teams I've been part of, but with react I always find there is a huge tendency to overengineer everything and make things a lot more complicated they should be in the name of purism or whatever reason. I consider myself as a more pragmatic person and Vue fits me a lot better overall.
- brianzelip 5y ago> (sadly reminds me of the python 2/3 situation) It’s nowhere close to the python version debacle that I first came across back in 2012, which was already years old. Vue v3 is very new if not bleeding edge. And there are polyfills for new v3 features like the Composition API[0]. [0] https://github.com/vuejs/composition-api https://github.com/vuejs/composition-api