Hacker News new | ask | show | jobs
by ant1oz 1489 days ago
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.

1 comments

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>
      );
    }