1 February 2018
In Vivify Ideas, the most of our developers come from a full-stack background. When it comes to front-end, most of us have experience in using Angular (and AngularJS), and some of us have worked with React.
We have hands-on experience with these frameworks. We know all about their ups and downs.
When it comes to Angular, although this framework has been present in the community since 2010, when it was initially released, contributors find it hard to tackle Github issues. Another big issue about this framework is the performance. AngularJS could slow down the initial load, which contributed to bad performance in general. Angular(4) tried to address these issues with AOT (Ahead-of-time compilation), tree shaking and Lazy loading Components. But still, Angular’s performance is disappointing.
Regarding React, the biggest downside for us was the learning curve. We found it hard for someone coming from the web background just to jump in React. There is no templating system, you would have to use React to manipulate DOM, which was extremely hard to adopt by HTML/CSS coders. Someone might say: you can use JSX, but that would add extra time for learning.
So we used to stick to Angular.
Why We Choose VueJS…
Instead of React
Virtual DOM — nowadays HTML DOM trees are huge, which means they can’t be traversed quickly and with modern SPA — we need to update ID a lot. Here comes the Virtual DOM, which is an abstraction of HTML DOM and reduces the performance impact of redundant operations of updating HTML by making each non-final operation much faster. Vue’s Virtual is slightly more lightweight than React’s.
For large applications, both Vue and React offer robust routing solutions. The React community has also been very innovative when it comes to the state management solutions (e.g., Flux/Redux). These state management patterns and even Redux itself can be easily integrated into Vue applications. In fact, Vue has even taken this model a step further with Vuex, an Elm-inspired state management solution that integrates deeply into Vue which offers a superior development experience.
Vue offers a CLI project generator that makes it trivially easy to start a new project using your choice of a build system, including webpack, Browserify, or even no build system while React’s offers only create-react-app which has some limitations (for example, no configuration available at all).
Native rendering is now also available with Weex, a cross-platform UI framework developed by Alibaba Group, meaning you can use the same Vue component for mobile and web rendering. Also, Native Script is coming soon.
Instead of Angular
Unlike Angular which requires TypeScript, and can lead to overhead in small-scale use cases, Vue, again, offers a choice. By default it comes with ECMAScript 6, also known as ECMAScript 2015, but also offers official typings and official decorator for anyone who wants to use TypeScript.
One major downside of Angular is its bundle size. Even with AOT and tree shaking Angular’s bundle is about 130KB, while Vue’s bundle is about 30KB gzipped (with Vuex and Due router included). Vue also beats Rect (the bundle is about 43 KB gzipped).
Vue is much less opinionated than Angular, offering official support for a variety of build systems, with no restrictions on how you structure your application.
When it comes to performance the numbers say it all:
Author: Jelena Pršić
Full Stack Developer at Vivify ideas