HN Explorer

Vue3/Nuxt3 poor adoption compared to React

3 points by mvgmvg ↗ HN
Is it me or Vue3 is maybe going to be the last version of the framework. Started out as a lovely, simpler alternative than React but have a feeling the new API proposed in 3.x gives you 0 reasons to pick it as opposed to React.

4 comments

[ 4.5 ms ] story [ 25.1 ms ] thread
ant1oz
It is you.

Vue3 sounds perfect, The major upgrade from v2 is the use of Proxies (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...), which was missing at the time of Angular v1, which enables native dual binding - and global dual binded deep complex objects.

I personally think React is way over-complicated - and was solving a debugging problem in 2015 - when proxy were not around.

Now look at this vue3 code, and please try to do the same with React

    // file A.js - uses the basic vue proxy implementation

    import {ref} from 'vue';
    export const a = ref([])
    a.value.push(1)

    // 'a' could be a complex library - that is self contained.

    // file B.vue - the actual .vue component

    <template>
       <ul>
        <li v-for="(key, value) in arr">
          {{key}}=>{{value}}
        </li>
      </ul>
      <button @click="add()">Add element</button>
    </template>

    <script>
    import {a} from A.js
    component('hello', {
      setup() {
        const add = () => a.push(a.length+1)
        return {
          arr: a, 
          add
        };
    }
   });
/* No props here, it uses a global object For example, you could have a library that keeps an array of loggedin friends, that connects to websockets - and updates in real time - totally external to the vue UI. All you need is to import it - no need to pass it as a prop - or dependency inject it the angular2+ way */

This is simply not possible to do this with React, instead everything needs to be passed as props, or context. Hooks are even harder than that - as the side effect detection (by design) is dependent on the order of the hook declaration - making the actual reusability of the whole hook ecosystem quite complex and subject to headaches.

Also, keep in mind that Vue3 is now more popular than Angular2, and that it reaches the same number of stars on Github than React - while the number of developers being proficient with Vue is way lower.

In my own personal experience, developing a complex webapp with Vue is way easier than with React - and the developers familiar with it are usually way more experienced than the React uni under-graduate (pretending to be senior full stack developers - because they can write node.js - and spawn a firebase google hosted instance) - because those Vue devs - they know - and because they know - they choose Vue.

Vue4 engine - IMHO - could be written in Rust and compiled to web-assembly - if that makes sense in term of performances.

terandle
Check out valtio if you want to do proxy based state management in react.

https://github.com/pmndrs/valtio

https://codesandbox.io/s/bitter-night-mm4xes?file=/src/App.j...

    // a.js

    import { proxy } from "valtio";

    export const a = proxy([]);
    a.push(1);

    // App.jsx

    import { useSnapshot } from "valtio";
    import { a } from "./a";

    const add = () => a.push(a.length + 1);

    export default function App() {
      const snap = useSnapshot(a);
      return (
        <div>
          <ul>
            {snap.map((value, index) => (
              <li key={index}>{`${index}=>${value}`}</li>
            ))}
          </ul>
          <button onClick={add}>Add element</button>
        </div>
      );
    }
beebeepka
Where did you park your DeLorean?

Vue 3 has been out for a while now. These new APIs have been worked on for 3 years.

Nothing wrong with a little trolling, of course. It can a good conversation starter. But this is a very cheap shot. I ask for considerably more money if I am being forced to work with react

mvgmvg
I'm actually not _really_ trolling. I work in established/mid-sized/large-sized enterprise, have been for almost a decade. Do you know any big migrations that have been documented in the wild? I'd love to see some detailed reviews/walk throughs of that. We've got in-house developed component libraries, almost ten separate Nuxt2 applications, a lot of business logic.. Frontend developers tend to mix the greenfield/tutorial-level projects they see on youtube with real life apps. Maybe not your case. Looking forward for real-life examples of a 2/3 migration and some stats on Vue 3 adoption.