For web development, when all other considerations are equal, we recommend choosing Vue.
Here’s why:
Excellent Documentation
High quality documentation leads to better results – less time is spent wrestling with the framework or head-scratching about why something is working the way it is, and more time is spent making your project its best.
Performance
Vue uses a virtual DOM implementation. There’s a great deal to be said on this topic, and this should be considered an extremely pared-down summary. While reading and writing to the real DOM is a fast and inexpensive operation, the knock-on effects – layout re-calculation and repainting – are slow and expensive operations. Vue, by using a virtual DOM and efficient diffing algorithm, updates as little of the real DOM as possible, and batches such updates, to allow for the minimum of costly knock-on effects, improving rendering time and responsiveness. While directly manipulating the DOM can be faster if done carefully and correctly, in practice the dreaded WRW (Write-Read-Write) anti-pattern is all too common, leading to multiple costly repaints. A virtual DOM eliminates this issue.
Reactive
Like the React framework before it, Vue is reactive. This means that, with a little setup work, changing values in JS can create seamless, effortless changes within the UI that relies on those values. Instead of needing to imperatively manipulate the DOM to make updates, simply change the reactive property, and the node that relies on it will be re-rendered with the updated value in place.
Progressive
Vue is fairly lightweight, and can be attached to a single given DOM node, even using the existing DOM structure as it’s template if it finds one, allowing Vue to take over an existing page and progressively enhance it. This makes it a good candidate not just as the backbone of a new project, but also for introducing into an existing project to offer enhanced functionality in one small area of the application and slowly expanding from there.
Extensible
Vue focuses on, as the name suggests, the view aspect of the familiar MVC model (although Vue actually subscribes to the MVVM pattern). Other modules within the Vue ecosystem focus on routing (Vue-Router), state management (Vuex), and extend Vue. There are many other Vue plugins within a healthy developer ecosystem, and creating your own plugins is easy and well documented.
Single File Components
Single File Components are useful units for organizing the structure, logic and styling of a reusable component into an atomic form, and make it much easier to reason about the operation and composition of a given component compared to a more traditional approach. Separation of concerns is maintained without requiring the elements of a given component to be spread across many different files. This approach borrows many of the best ideas of the standardized Web Components, without that standard’s compatibility limitations.
Familiar Templates
In place of React’s JSX, or yet another DSL, Vue allows you to use the familiar syntax of HTML in your templates. Similar to angular, directives live as attributes on your elements, and custom elements can be declared, imported and used like standard html tags. It’s elegant and effective. And if you’re a fan of Pug, you can use that instead (or in addition to) your HTML templates, eliminating the verbosity of HTML without losing any of the familiar syntax. Vue does allow falling back to directly writing render functions, if for some reason your use case requires it, as well as supporting JSX if desired.
Integrated Toolchain
In order to take advantage of some of the features of Vue, you need a toolchain to build the scripts, extract the various components, and tie everything together. Vue comes with toolchain support out-of-the-box via the vue-cli, which even provides a limited web-based GUI for customizing certain aspects of your project and adding community-provided plugins. Under the hood, vue-cli relies on webpack, and provides guidance and tools for interacting with it if the standard configuration isn’t sufficient for your project’s needs.
Cross-Platform Support
Via Vue Native, developing cross-platform mobile applications using Vue is straightforward and powerful. Under the hood, Vue Native is really React Native, providing a wrapper around the latter’s APIs, so all of the same Pros and Cons that apply to React Native apply here, with the significant pro that the continued development on React Native directly benefits the Vue Native platform as well.
Widely Used
Companies like Gitlab, Nintendo, Facebook and Netflix make use of Vue in their development toolset. https://www.netguru.com/blog/13-top-companies-that-have-trusted-vue.js-examples-of-applications https://www.techuz.com/blog/top-9-websites-built-using-vue-js/
Open Source
Vue is MIT licensed. The MIT License is one of the most permissive open source licenses, allowing you to transform the original source, bundle it with your own application in any form, and does not require open sourcing the resulting application. The only requirement is to include the license and copyright notice originally bundled with the source code, making software under this license an excellent choice for inclusion in commercial products.
