Pros & Cons of Vue vs React - Milu Franz
Milu Franz of Mile Two gave a great presentation comparing the advantages and drawbacks of both Vue and React. I'm novicely versed in building with Vue but I was interested in how it compares to the more popular React library.
She showed that Vue is a progressive framework which includes official packages for state management and routing, whereas React is a library concentrating on UI development but has external third party packages for state management and routing. Also she explained the differences between Vue's template syntax, where it combines the markup, logic, and styling (as separate sections) in one single file component, and React's format, where markup is included inside the JavaScript code as JSX and styling is imported from an external .css file (unless using CSS-in-JS). Note that Vue components can also be modeled in the same fashion as React ones, if desired for more intricate customization, but the template syntax is a preferable method of designing most types of components.
Milu went over building the same To Do List project in both Vue & React, going over Vue's concepts of using interpolation in the markup (to insert JavaScript) and directives such as v-model for two-way data binding of state (that really can be described as magical). This is compared to React where explicit defining of state (through the useState hook) is required. The key differences are that Vue abstracts handling state so you only need to directly update a value (versus using a function to update it) and that Vue will only re-render what changed while React might re-render everything in that component's subtree structure.
Lifecycle method differences were explained as well as React's useEffect hook. Run-time performance was also compared with both being more performant depending on the use case. Milu even went over drawbacks to each: Vue with potential over-flexibility and lack of resources; and React with its steep learning curve, lack of native libraries, and difficulty in collaborating with designers (harder to translate to markup when JSX is required).
My take from the presentation was that React is still more popular - it's been out longer and there's something that captivates developers to write it all in JavaScript, but Vue is catching up in terms of maturity, performance, and use cases. Both are fully able to help developers create engaging applications. I'm more of a Vue fan, obviously, but I can see why developers are attracted to it for their projects. For me, though, I really like the template markup as I can more easily visualize the layout without all the JavaScript around it. I also don't mind that Vue handles the state so magically for me. Abstract it away and make the process easier.
I'm sure there are plenty of other technical differences and opinions that make one better than the other but I look at it like I do with other technologies: Use what you like and what works. And keep the solution simple.
Top comments (0)