Adding Vue.js to Your Technology Stack
Everything
You Need to Know

Choosing the right framework for your product is like buying your first house. You must make a decision that will affect you in the long term and that cannot simply be undone once you’re bored or just aren’t fond of it anymore. And all the while you need to be aware that once you make the investment, you won’t able to afford a new one anytime soon.

Even after you finally find a house you feel you’re ready to pull the trigger on, you still may have some reservations: you love the facade, but the backyard could be a bit bigger. You like the colors of the walls, but you’d prefer a slightly different shade. Plus, the kitchen kinda feels outdated. Well, let’s be honest—there simply isn’t a perfect house out there that would just have it all. Especially when it’s your first one. Even if you decided to build one from scratch, there would always, always be room (room, get it?) for improvement.

And this is exactly how it feels when you have to choose between Vue, Angular, React, maybe Backbone, Aurelia, or some other library. Some of them feel good for your product, some of them don’t. They all have their flaws and all have aspects to them you just love.

(We won’t even try to mention the ever-changing landscape of JavaScript, because it will make you question the very sense of even making such a decision, and then flip the table over once you have it set every now and then.)

Nevertheless, it’s truly awesome that nowadays we’ve got so many viable technology options to choose from, and thus so many avenues we can choose to help us solve our users’ problems.

Most people who follow Monterail know that we personally favor Vue.js and like to suggest our Vue.js development services to our new clients. No two products are the same, however, and we like making educated decisions, unbiased by external factors.

In 2022, it was in the top trendiest repositories in the JavaScript world, receiving almost 200,000 stars on Github, surpassing the numbers for Node or React. 

With every passing month, Vue gains more traction and records ever high downloads numbers. There are obviously reasons for that, and we will be discussing them in Chapter One.

When you first start working with it, Vue may at first glance seem that perfect house you’ve been looking for. BUT. That’s right. There are always some “buts”—although in this case, they become noticeable primarily when Vue is compared to other technologies, as covered by Chapter Five.

So, before you decide to add Vue.js to your technology stack, read this.
  1. 1
    What Makes Vue.js Unique?
  2. 2
    The Evolution of Vue.js
  3. 3
    Research and Data From Vue.js Developers
  4. 4
    Which Companies Use Vue.js?
  5. 5
    Vue.js vs. the Rest of the JavaScript world
  6. 6
    What’s the Future of Vue.js?
1

What Makes Vue.js Unique?

“What’s all the buzz about?” you ask? Vue.js has been growing like crazy and there seems to be no stop to its rapid progress. And this is what makes it a one-of-a-kind solution.

 

We first encountered Vue.js in late 2015 as we were looking for a viable alternative to AngularJS and React.

AngularJS already felt outdated back then and we weren’t fans of React mostly due to the fact we weren’t initially sold on the whole JSX idea. Vue drew our attention due to its super friendly documentation and over the next couple of months our developers researched Vue extensively within several internal projects to see whether it would fit with the rest of Monterail’s stack.

Vue has seen a tremendous rise in popularity since we’ve first heard about it. Although it started out small, it has since been adopted by companies and business entities across the board, big and small, including major industry players such as Alibaba, GitLab, Sainsbury's, Codeship, and Baidu.

Vue is flexible, easy to learn, and powerful. Its ecosystem is still growing and it already has everything you need to build all kinds of applications (yes, mobile apps, too).

If you’re thinking now that you can say the same things about numerous other libraries, you might be right. You can probably build your dream app with any of them and you will meet your goals. Your users will never know if your product is Vue-based or any-other-framework-based and let’s be honest—most of them don’t really care.

And yet choosing a framework is a hard task, because it will strongly influence your in-house production team (or your offshored team, if you prefer it that way).

So what are Vue’s main selling points that make developers and business owners select it as their technology of choice? What is so unique about it?
1

It’s community-driven

Some skeptics may say that Vue is not a viable choice because it lacks the support from large tech corporations like Google and Facebook (and let’s not forget the issues with React licensing from years ago). This opinion is truly belittling to the community standing behind Vue. Since its very beginning, more than 382 people from all over the world have contributed to the Vue.js repository.

Vue 3.2 „Quintessential Quintuplets” was officially released in August, 2021. Since then, Vue has grown into the full ecosystem over time, consisting of a library like a router, state management, build tooling, dev tools, extension, IDE support. 

Evan You, the creator of the framework, decided to dedicate 100% of his time to Vue and manages to do that thanks to his Patreon sponsors. The Vue.js core team also collects funding via OpenCollective, to cover the costs of their work and other expenses, and organize community events.

Speaking of events—in 2017, our dear Monterail team organized the first international conference dedicated solely to Vue and since then, many other Vue conferences have been organized all over the world.  

In February 2020, the Vue Documentary was released and available to watch free here. 
2

It’s progressive

Vue.js is called a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. So what does it mean exactly?

It means that Vue.js is a framework that you can progressively opt-in to. Regardless of whether you scale your app up or down, it will work just as well for you and will stay flexible in terms of tooling configuration, number of features, and team collaboration. For example, when a site’s complexity scales up, libraries like Vuex and Vue-router can be adopted incrementally.
3

It’s easy to integrate

Ease of integration is the key advantage of Vue according to the survey results published in State of Vue.js. An impressive 76% of developers emphasized its relevance when it comes to Vue. This very trait was brought up by respondents more frequently than Vue’s documentation and performance.

You can start working with Vue simply by adding a single line of code and *tadam*, you’re ready to go.
4

It has a smooth learning curve

Vue seems to be the first framework that makes it extremely easy to introduce new people into the project. Even if they don’t have any prior experience with Vue.js but know JavaScript reasonably well, they can get productive in a matter of hours in a mid-sized project.

On the other hand we’ve got React, which requires some decent knowledge of JSX and probably css-in-js, since many examples use this approach.

Angular’s learning curve is even steeper. Users need to familiarize themselves with many various concepts before they can get productive. Its complexity may be the result of the framework’s focus on complex applications. Therefore, it may not be the best choice for less experienced developers.
5

It enables time-efficient coding

This one is slightly related to the previous point. Vue.js is easy to start with and makes coding faster. The time from writing the first line of code to releasing your MVP will be shorter than in the case of other frameworks. It also allows you to use less code to achieve the same results, and that means less time spent on development and better cost efficiency.

To quote Matthias Götzke: The API is straightforward. The code is lean and not over-engineered. The choices made are logical. Code has clear separation of concerns and doesn’t try to do things it shouldn’t.
6

It’s flexible

One of the main reasons behind Vue’s popularity and growth is the amazing flexibility of the framework. According to Vuejs.org, “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. Many developers enjoy this freedom, while some prefer having only one Right Way to build any application.”
7

It has top-notch documentation

Scott O’Brien, lead UX designer at Chess.com, said “It was the first time I’ve read the entire documentation in one sitting. It was 1:30am in the morning. By the time I got to the end of it, I knew that Vue.js was something special.”

This is a good example of how developers feel about Vue’s documentation (carefully curated by Chris Fritz from the core team). Many guides, examples, questions, and APIs cover everything you may need once you start working with it.
2

The Evolution of Vue.js

As a project, Vue.js has come a long way to become what it is today. It has grown from a small experiment into a mature framework that is used by hundreds of thousands of developers all over the world.

 

The first Vue commit is dated back to June 27, 2013. That was the time when it still was called “Seed”. 

The first name stuck for nearly six months before it was eventually changed to Vue in early December of 2013. The first public release (0.8.0), however, was unveiled only in February of 2014. At the time, Vue was a library that only focused on the View layer of the MVC architectural paradigm.

There were several important aspects of Vue that made it “click” with developers. The template syntax followed a style similar to AngularJS and a component-based architecture introduced by React, thus creating a smooth bridge between the two mindsets.

Vue is somehow a golden mean that got the best parts of AngularJS and React, with a constant emphasis on developer experience and approachability.

The JavaScript community became increasingly interested in Vue, but it was a year later, when the Laravel community (gathered around this popular PHP framework) first discovered it that Vue really took off. A couple of months later, the long-awaited 1.0 version was finally released. This was a groundbreaking step for the library.

In the meantime, the community saw the release of vue-router (August 18th, 2015), vuex (November 28th, 2015) and vue-cli (December 27th, 2015) . These libraries marked the transformation of Vue from a View-layer library into what we today call the Progressive Framework.

In April 2016, we’ve seen the release of the much-anticipated version 2.0—a complete rewrite of the framework which introduced several new concepts like the Virtual DOM, as well as and Server-Side Rendering capabilities. However, the API remained virtually unchanged, so the migration was smooth. The official vue-migration-helper tool helped the process, too.

The latest big release of version 3.2 - „Quintessential Quintuplets” happened in August 2021 and it became the default version six months later. Vue 3.2 has continued to improve performance and add features for Single File Components. Many libraries embraced Vue 3 and added support for it, while others have compatible releases on the way. 

Since the beginning, the Vue community has grown, developed and matured a lot. For the last couple years, Vue developers have created many libraries and tools, and the framework itself has become very stable and reliable. 

The Vue community continues to work on making it even better. On December 31, 2023, Vue.js 2 will reach its End of Life (EOL). After this date, the second version of Vue will still be available in all existing distribution channels, such as CDNs and package managers, but it will no longer receive updates, including those for security and browser compatibility (although HeroDevs declared a full support for Vue 2.7 in case of any issues) 

To facilitate an easier transition to the upcoming changes with Vue 3, Vue.js 2.7 was introduced. One of the key features of Vue 2.7 is the @vue/compat build, also known as the 'migration build'. This build provides a compatibility layer that allows most Vue 2 code to run without changes, while emitting warnings for code that needs to be updated to work with Vue 3. The con is that using @vue/compat may lead to performance issues, yet it can still be a solid offer for some projects.


Vue.js 3 vs Vue.js 2

Vue.js 3, also known as Vue 3, is the third version of the popular JavaScript framework Vue.js, which is used for building user interfaces. Released in September 2020, Vue 3 has become the default version of Vue.js as of February 2022.

Vue 3 introduces several new features and improvements over Vue 2:

  • Performance
    Vue 3 is faster, smaller, and more maintainable than Vue 2. It offers code that is more efficient and maintainable while still being lightweight. Vue 3 also comes with many performance improvements out of the box, such as strategic code splitting for fine-tuning performance, particularly for large-scale applications.
  • Composition API
    One of the most significant changes in Vue 3 is the introduction of the Composition API, a new API for a function-based approach to writing components. This API is inspired by React Hooks and lets developers encapsulate logic into "composition functions" and reuse that logic across components.
  • Improved reactivity system
    Vue 3 has a more advanced reactivity system than Vue 2. For example, computed properties in Vue are a go-to choice for caching, as they are recalculated only when their dependencies change, minimizing redundant computations.
  • Multiple v-models
    In Vue 2, only one v-model could be used in a single component. However, Vue 3 allows passing multiple v-models to components by specifying their names.
  • Better TypeScript support
    Vue 3 offers better TypeScript integration right from the scaffolding, providing type safety.
  • New features
    Vue 3 introduces several new features such as Teleport, Fragments, Suspense, and others.

Despite these improvements, Vue 3 maintains backward compatibility with Vue 2 to a large extent. This means that many of the key concepts from Vue 2 are still applicable in Vue 3.

The Community

Fast forward one year and the still-thriving community has made Vue.js one of the top 3 most popular JavaScript frontend frameworks to date. And it doesn’t look like it’s going to stop there.

People fell in love with Vue. But rather than trust in our emotional assessment, take a look at the numbers…

Vue is currently one the most starred projects on GitHub.

Talk about developer enthusiasm!

The community interest is incredibly strong—since the launch of the Vue Newsletter, hundreds of people subscribed in a matter of minutes.

The never-ending stream of email notifications made us feel like Instagram stars. The first issue of the newsletter went to 759 subscribers. seventy-seven weekly issues later, our audience has grown to nearly 7,000 subscribers. Each new issue is harder to prepare because of how much new Vue-related content surfaces basically every week now.

Apart from the newsletter, you can listen to the Vue.js podcasts: Views on Vue , Enjoy the Vue, or take part in meetups and conferences. 

High-quality tutorials, insightful articles, and all the libraries I could ever think of now tend to show up daily. It’s insane! And that’s not all—the Vue community is bolstered with a thriving forum and a Discord channel, with thousands of developers active on both of these outlets each day.

Additionally, we can see that a growing number of companies across the globe are increasingly betting on Vue, following the rapidly growing interest of their developers. We we’ll get back to that later...

The Ecosystem

It’s worth mentioning that apart from the community projects, the Vue Core Team also maintains several official libraries, such as vue-router, vuex (state management), vue-rx, and vuex-observable (for RxJS), as well as tools like vue-cli, vue-server-renderer, vue-loader, vetur, vue-migration-helper and many more! All in all, Vue.js owns 112 official repositories.

Why is this important, you ask?

Because it allows you to progressively opt-in to use other core libraries that transform Vue into a full-fledged framework like Angular or Ember, with the guarantee that it will work seamlessly. However, you can always switch parts of it for other, unofficial solutions, if that is what your project requires.

Another good thing about the official supporting libraries is that they always represent the highest quality and offer long-term support and compatibility with Vue itself.

As one would expect, a massive and highly involved community such as Vue’s comes with a significant number of community projects. And not just small, focused libraries, we’re talking large-scale projects here.

Nuxt.js: The Easy Way to Develop Vue.js Applications with SSR Support

Nuxt.js is one of the most significant roles in the Vue.js ecosystem. This open-source framework was designed to streamline the creation of full-stack web applications and websites using Vue.js. It provides best-practice solutions to standard development challenges like routing, server-side rendering, code splitting, and more, allowing developers to accelerate the development process.

Advantages of Nuxt.js:

  • Many Rendering Models
    This includes the most known SSR, but also SSG, ESR. What's more - it is easy to embrace a hybrid approach and tailor a custom solution with mixed rendering strategies.
  • Automatic code splitting
     It automatically splits code into smaller chunks, resulting in faster page loads.
  • Simplified configuration
    Nuxt.js handles much of the setup and configuration, allowing developers to focus more on building custom app features.
  • SEO Improvement
    With its server-side rendering capabilities, Nuxt.js makes the app more accessible to search engine crawlers, positively impacting SEO.
  • Development speed
    Nuxt.js accelerates and facilitates the development process, making it an ideal solution for building MVP (Minimum Viable Product).
  • Vue 3 compatibility
    Nuxt.js has been updated to take advantage of the new features in Vue 3, such as better performance, the Composition API, and enhanced TypeScript support.
  • Automatic routing
    Nuxt.js automatically generates routes based on the file structure, simplifying the routing configuration.

Other solutions in Vue ecosystem worth mentioning:

Nuxt, although the best known and popular, is not the only solutions capable of supporting the development of Vue.js applications.

  • There’s the Quasar Framework, which helps with the development of hybrid mobile and desktop applications.

  • There are also several very popular UI frameworks like Element-UI and Vuetify that will give you dozens of unified UI components to bootstrap your application.

  • Vue also gets more and more support from mobile development frameworks like NativeScript and OnsenUI by Monaca.

  • The Vue Use, an impressive collection of essential Vue Composition Utilities, provides over 200 functions that work for both Vue 3 and Vue 2.

  • Vue-Threejs is a comprehensive resource for devs looking to integrate 3D graphics into their Vue applications using the Three.js library.

  • PrimeVue is a versatile and comprehensive UI component library for Vue.js. It allows developers to choose from over 400 ready-to-use UI blocks that can be copy-pasted to build applications quickly, or create their own.

  • Nuxt UI is a user interface library specifically tailored for use with the Nuxt.js framework. It provides a comprehensive collection of fully styled and customizable UI components. 

Vue already has everything your app will probably need. Each week I see more and more libraries being published, to the point that it’s impossible to keep track of all of them.

Many of those libraries can be found on this list of awesome things related to Vue.js.

It is worth checking the site Vue.js Examples. This resource provides a collection of Vue.js examples. It contains a wide range of user interface (UI) components, tools, and applications built with Vue.js. The website also features real-world applications developed using Vue.js, demonstrating the vibrancy and diversity of the Vue.js community.

The Backing

Many people point out that Vue is not backed by any large company in the same way Angular or React are, and they act like it’s a bad thing.

However, Vue truly embodies the spirit of open-source, similar to jQuery, Babel, or webpack, which are among the most reliable tools in the JavaScript world.

Moreover, the tools created by the Vue community are not limited to Vue, and the greatest examples are Vite and Vitest.

Vite, built within the Vue ecosystem, is usable with other UI frameworks. It has been widely embraced by the frontend community and has inspired the creation of numerous plugins, boilerplates, and templates. It has also been adopted by several popular frameworks as their recommended build tool, extending its popularity far beyond the Vue ecosystem.

Vitest, on the other hand, is a unit testing framework for Vue applications. It is created and maintained by members of the Vue and Vite teams. Vitest is compatible with the Jest API and offers unique features that make it a preferred choice for testing Vue applications. It uses the Vite dev server to transform files during testing, thereby eliminating the redundancy involved in using testing frameworks that require their own configuration.

Thus, the open-source nature of Vue can be a significant advantage, as the project does not have to follow the needs of a particular company and can instead focus on what the community needs.

But the focus on developer experience goes far beyond webpack and is present in every aspect of the library, starting from its ease of use, through smooth integration, and up to top-notch documentation and overall scalability.

Obviously, Vue.js—again, like almost every other open-source library—began as a one-man project. Since then, it has grown to the point where it has a fully-staffed core team that takes care of different aspects of the library and its ecosystem.

The funding? Over the last years, individuals and companies from all around the world decided to support Evan You (the creator) and the Core Team with a stable monthly income of over $16,000 through successful campaigns on both Patreon and Open Collective. This allowed Evan to shift to working on Vue full time.

The sponsors include multiple companies and hundreds of other private backers. The list of current sponsors can be found here.

The Growth

Here are some numbers that might give you a feeling of how fast the Vue ecosystem is growing.

Let’s take GitHub stars for example. Although they might not be the perfect metric to demonstrate the popularity of a project just yet, they surely reflect the excitement around it. And the excitement was high enough to make Vue one of the most starred projects in the last few years. Not just within the JavaScript or frontend categories. It was the second most starred project, period.

As for 2022, it’s the eighth most-starred frontend framework.

Surveys like the State of JavaScript 2021 indicate that Vue has one of the highest satisfaction ratings and 85% of developers who’ve used Vue before would pick it again. According to our own research which we’ll mention latter, a huge percentage of Vue.js developers would use Vue.js for their next project.

Naturally, there is a number of other metrics to check out, such as monthly npm downloads (~4m!). Looking at the momentum Vue currently has, it’s safe to assume the numbers will grow at an even greater pace in the coming years.

A big part of this growth comes from the fact that more and more companies are picking Vue as their main frontend framework. Among other things, these recent adopters have been praising Vue’s incredibly smooth learning curve, ease of integration into their existing stack, top-notch performance, and—what’s probably the most important factor—the improvements in development speed and reductions in maintenance costs. In other words, choosing Vue saves money.

But don’t take my word for it just yet. To make our case, we surveyed 1,635 developers and CTOs from 114 countries, and collected several case studies, hailing from a range of different industries, that have adopted Vue. Read on.
3

Research and Data From Vue.js Developers

Vue.js was created to help more developers enjoy building apps on the Web. How does this mission come with reality?

 

For years, tech communities have run surveys to determine satisfaction levels for different technologies. In this chapter, we will discuss research from the State of JS and State of Vue.js 2021, focusing on the latter, as it was devoted exclusively to Vue.js and gives an overview on how Vue.js developers use Vue. The State of JS survey on the other hand was conducted on much more diverse groups of devs, thus giving us better insight into how Vue compares to other frameworks when it comes to the satisfaction level.

State of JavaScript 2021

According to State of JS 2021, 41% of developers have used and would like to use Vue.js again while 21% would like to learn it. 

The number of avid Vue users has grown substantially over the years. Looking at the satisfaction levels might give us a clue as to why that is:

State of Vue.js survey results

After VueConf, which Monterail organized back in June 2017, we came up with the idea of creating a comprehensive report on what’s going on in Vue.js (which we already quoted here). As part of the report, we decided to conduct a survey among Vue.js developers to learn more about their experiences with Vue.

We conducted a survey in August and September of 2017. We received 1,126 responses, mainly from software developers and Chief Technology Officers (94.1% of the respondents held these or related technical roles) whose organizations use Vue.

Responses came in from every continent on Earth (except Antarctica); in total, we’ve managed to collect replies from 88 countries.

We also asked Evan You, Vue creator, and Chris Fritz, Vue Core Team member, to comment on some of the survey results in order to provide additional insights or to share their broader perspective.

In 2021, we released an updated report with data collected from even more (1,635) respondents. If you want to access all that data with comments, get the new, updated State of Vue.js report. Here, we will outline only the most important insights that may be useful if you’re considering using Vue.js for your product. 

In an online survey we asked a number of questions to determine:

  • what were the reasons behind adding Vue to their tech stack,
  • what advantages did working with this framework offer them,
  • what were their main doubts with regard to using Vue in their project,
  • what resources did they use to master Vue.js,
  • how many of their colleagues use Vue and whether they expect this number to grow in the next 12 months,
  • for how long have they and their teams used Vue.js,
  • what other backend and frontend technologies are used in those companies.

Here are main takeaways from the updated State of Vue 2021 survey:

90%

survey participants would use Vue.js again for their next project.
93%

of the respondents used the Official Vue documentation as their main source of knowledge about the framework.
75%

of survey participants say that ease of integration is one of the chief advantages of having Vue in their organizations’ tech stack.
56%

are convinced Vue.js is going to get more popular in their organization in the next 12 months.

Survey questions

What was the most important reason behind adding Vue.js to the technology stack?

The developers are more or less unanimous: Vue.js is pretty easy to start with, even for a really complex applications. They appreciate its simplicity and architectural elegance, elaborate on how easy it is to integrate Vue, but also compare its lightness and performance to other popular frameworks, claiming Vue is the unquestionable winner here. All in all, Vue.js is described as a beginner-friendly framework by more than half of the respondents.

The most important reason behind adding Vue to the tech stack

important reason state of vue 2021

Could be used for existing and new projects + pretty easy for sure!Chief Technology OfficerLarge enterprise, France

Easy to integrate with existing apps or go full SPA.Software developerMedium enterprise, Australia

What were the doubts you and your team had when planning to add Vue.js to your tech stack?

Lack of former Vue experience among their colleagues was seen as a possible issue when planning to add the framework to their tech stack (49%).Lack of a popular native development platform was mentioned by 18% of respondents as their doubt when considering using Vue.js.

Doubts when adding Vue.js to tech stack

Percentages do not sum up to 100% due to the multiple choices.

doubts when adding vue.js to tech stack

We do have Weex and NativeScript, but we acknowledge they both have areas to improve.Evan YouVue creator

Vue’s mobile options are constantly improving. In the meantime, though, Vue offers very strong support for Progressive Web Apps, including a dedicated template. Community projects like Onsen UI even simplify the process of building native-like, hybrid UIs.Chris FritzVue Core Team member

Doubts about Vue.js scalability were chosen by 172 survey participants, making it one of the five most prevalent doubts plaguing developers planning to add the framework to their current tech stack.

Architectural-wise, Vue is built on the component-based model for UI development which is a proven pattern shared among all major frameworks, with solid official solutions for SPA routing and large-scale state management. It is designed for approachability, but is also designed with scale in mind.

We also have many users successfully building large scale projects with Vue, some even with hundreds of components and are still perfectly happy with the workflow. In addition, some existing big apps are being rewritten with Vue and we’ve received very positive feedback from devs working on them, for example Adobe Portfolio and JSFiddle.Evan YouVue creator

What are the biggest advantages that Vue.js brings to your organization?

An impressive 75% of developers emphasize ease of integration when it comes to Vue. The majority remarked upon how it is to master Vue and claimed that it’s much easier to learn than other popular frameworks. They also appreciate its uncomplicated integration with backend frameworks .

Documentation is another strong point of Vue, brought up by 76% of surveyed developers. A similar number of respondents (50%) identified the framework’s performance as its biggest advantage.

The biggest advantage

Percentages do not sum up to 100% due to the multiple choices.

advantage state of vue 2021

Vue.js makes frontend development manageable and scalable. The learning curve is pretty easy so backend developers can easily get what's going on without too much guidance. Since there are a lot of pretty good webpack configs already out there, it kinda feels like plug and play nowadays. Finally, the fact that we can use Vue.js either via run time or compiling it, it's a pretty amazing tool to use from small to large applications without too much difficulty in scaling.Software developerSmall business, Philippiness

What's the probability of you using Vue again for a new project?

More than 83% of respondents claim they would use Vue.js again for a new project. A number that high clearly proves that their doubts went away once they gained experience with the framework.

The probability of using Vue for next project

state_of_vue_2021

 

Do you think the number of employees using Vue.js in your organization will increase in the next 12 months?

34% respondents strongly agree that the number of Vue.js employees will increase in the next 12 months and the result is very similar to previous years. Only 11% respondents is of the opinion that the share of Vue.js is going to stay the same.

INCREASE IN THE NUMBER OF EMPLOYEES USING VUE.JS
increase in the number of employees using vue.js 2021

Other projects in the company are going to use Vue (or already do)Software developerLarge enterprise, France

We're hiring like crazy and have lots of projects coming up. They'll all use Vue.Head of EngineeringLarge enterprise, Germany

What are the main technologies and frameworks you use for frontend development?

Main frontend technologies and frameworks

Percentages do not sum up to 100% due to the multiple choices.

state_of_vue_2021

What are the main technologies and frameworks you use for backend development?

The main back-end technologies and frameworks

Percentages do not sum up to 100% due to the multiple choices.

back end state of vue 2021

Why so many companies chose PHP and Node.js? One of the best reasons is server-side rendering. In Vue, server-side rendering has been possible with Node.js for a while now. Thanks to PHP v8js, it is now also possible in PHP.

There might be another reason why so many businesses use PHP with Vue. At the very beginning of its existence, Vue.js was noticed by Taylor Otwell, the creator of Laravel (April 2015). That was the the first instance of Vue getting real-life traction. Many companies, already working with PHP, decided to start experimenting with Vue. We may assume that Taylor’s efforts to evangelize Vue may have had some genuine impact on its popularity.
4

Which Companies Use Vue.js?

You already know that Vue is willingly used by developers due to its smooth learning curve, great documentation, and ease of integration. But using a technology only makes sense when the tech itself is ready for commercial usage.

 

Many businesses may think that seeing that Vue is not supported by a major corporation, it is not stable and not ready for commercial applications. If you do some digging, however, you will discover that Vue.js is already used in many products and by many companies you know.

This chapter will give you an overview of which companies use Vue.js, as well as explain how GitLab, Codeship, and Livestorm arrived at the decision to adopt it and how it changed their business.

Developers from China, Evan You’s (the creator of Vue) country of origin, make up a considerable portion of the overall number of developers who adopted Vue. Examples of Chinese companies using the framework in their products include Alibaba, Baidu, and Xiaomi.

The list of companies using Vue, however, is much longer and not limited to Asia, and keeps on growing as companies and institutions adopt Vue and hire developers to staff their teams, including NASA apparently (!). As of today, the list includes:

When we were working on the State of Vue.js report we had the pleasure of meeting and interviewing some of the companies listed above. These conversation ultimately produced six case studies which offer a substantial body of evidence proving that Vue is a mature technology, used for commercial purposes by companies of various shapes and sizes.

All six companies we interviewed had faced the challenge of choosing the right framework, and they all decided to go with Vue—even though they were in different stages of growth and had different goals.

If you’d like to read all of them, see Chapter Four in the report. Below, you’ll find stories from Codeship, GitLab, and Livestorm, told by company insiders.

Before Codeship started working with Vue, their audience experienced freezes and browser crashes. They had a long list of users who were dissatisfied with the performance of the app. Their story is a great example how Vue can help build a reliable software, with bulletproof, easy-to-maintain code.

Jacob Schatz, frontend lead at GitLab, explains the company’s decision to move from jQuery to Vue.js and describes key challenges they encountered along the way. Their focus on better UX resulted in a more desirable product and thus in increased sales.

In the Livestorm case study, Gilles Bertaux, co-founder and CEO, describes how the company created a profitable product from scratch. Thanks to Vue and its reusable components, their development has been faster and much easier.
1

Codeshipwww.codeship.com

Codeship is a Continuous Integration Platform in the cloud that lets you ship your apps with confidence. Open source projects are always free on Codeship.

Roman KubaLead Frontend Developer at Codeship“Vue gave us all the flexibility we needed, to do what we wanted to do. It offers a solid foundation that can be expanded any way we like and it’s not opinionated about tools we use in the pursuit of our objectives. That’s what I really like about it.”

Challenge

Codeship, a CI platform used by companies such as CNN, Red Bull, and Product Hunt, launched in 2010. With jQuery and CoffeeScript in their stack, they built a successful platform for developers around the globe.

But as time went on, the team realized that it’s time to find a technology that would support further development and facilitate building more complex things.

“To give you some perspective—Codeship is used by a ton of customers who rely on it in their day to day operations. When we’re working on a feature for, let’s say, four months, it somehow feels bad, like we’re holding something back from our customers. If we spend two months fixing features, this in turn means two months of pain and uncertainty for them. It is absolutely crucial for us to be fast and deliver reliable products,” Roman says.

“We have pages that basically show the complete terminal output as readable log for our users, so they can see what test went through and what output they have. It was clear very soon that something like jQuery, on which our product was running before, wouldn’t cut it anymore because of the growing complexity,” Roman reflects.

“We started working with Angular 1, which we used for the next six months. Why? Well, mostly because I was already familiar with it.”

The company switched to Angular and it was a good fit. Yet, as the service grew, it soon became apparent that sticking with it would not be feasible in the long term.

“One of the things that we tried to improve was the performance. That was the biggest problem with Angular. The sheer amount of data we needed to present on the build page was way over Angular’s capabilities. Customers were reporting serious issues with the app—the page was unresponsive, and some people were even experiencing freezes and browser crashes.”

Roman, however, didn’t want to give up on Angular right away.

“Of course, we tried to optimize as much as possible. I even tried to move parts of the rendering out of Angular’s default list rendering and use plain JavaScript instead, but it didn’t work,” Roman sighs.

“At some point, Angular was trying to grasp what was going on the page as Angular tried to keep track of its scope and ran the relevant digest cycles... That killed performance, regardless of whatever we tried to assuage the hit. There was no way it could have run smoothly.”

Another significant challenge that Codeship faced was improving the testing process and making the app more reliable.

“With Angular, we still leveraged acceptance tests as much as possible. We basically ran user stories in the entire application. It was incredibly painful to run unit tests with Angular itself and test component, module or controller only. It was barely giving us the full picture we so badly needed,” Roman explains.

Solution

The first step of transitioning away from Angular was getting the approval of the staff and the VPE.

“At first, it was a struggle to get everyone on board with with Vue. The team had never heard of it, whereas they knew of Angular 2 and knew that Google was throwing its weight behind it, and they knew about React, backed by Facebook. In conversation with the team, usually the first question was about the size of Vue.js community—people wanted to know whether there was any chance of getting support should the need to do so arise. Because the majority of our staff has roots in backend, they wanted to stick with trusted names they heard of.”

Roman decided to use his knowledge and research to convince them to move to Vue.js.

“I made some samples and an internal presentation to at least make them trust the decision and the reasons behind it. If you read briefly through the source code of Vue, you’d quickly see that the code is not so hard to extend by yourself. It’s not a giant entity like Angular or similar.”

Before Codeship jumped straight to development, they needed a proof of concept.

“By then I had little experience with Vue, my expertise in the framework was definitely limited. However, starting with Vue seemed effortless and I quickly felt that it would be the solution to most of the problems that plagued us. In one evening or so, I rebuilt a crucial part of our rendering with Vue, and tried it against a large amount of Loglines as a proof of concept. Then I did all the CPU profiling. That was the one thing that immediately demonstrated to my team that Vue.js has already given us a huge performance improvement. We cut the rendering time from 30 seconds to 7 or so,” Roman recalls.

Proof of concept in hand, Roman and his staff could finally start the transition to Vue.

“We tried to move the proof of concept and replace what we had with Vue. The actual risk here was quite minimal. We had a system that was breaking for users, so… What was the worst thing that could happen?” Roman laughs.

“I spent a week refactoring and rewriting the page and then shipped it to users for feedback, trying to get validation fast. After just one day we knew that all that problems that plagued us in the past were gone. Even with 15Mb of log rendered. With rendering times between 30 and 40 seconds (we’re currently working to decrease that number further), the app works splendidly across all browsers and we haven’t recorded a single crash.”

Moving from acceptance tests made the testing part more pleasant and reliable.

“We moved away from acceptance tests and started wondering what we can take away from and use Jest and Vue tests for. We use multiple components even for complex pages in Vue itself, but only test it through Jest for example, because we have snapshots and verify whether the render HTML is actually the one we want. “ Roman explains.

Outcome

The first step of transitioning away from Angular was getting the approval of the staff and the VPE.

“At first, it was a struggle to get everyone on board with with Vue. The team had never heard of it, whereas they knew of Angular 2 and knew that Google was throwing its weight behind it, and they knew about React, backed by Facebook. In conversation with the team, usually the first question was about the size of Vue.js community—people wanted to know whether there was any chance of getting support should the need to do so arise. Because the majority of our staff has roots in backend, they wanted to stick with trusted names they heard of.”

Vue.js helps Codeship organize their code and improve user experience.

“It helps us deliver features faster and our users love that they don’t have to wait for months for something they need or expect. One of our pages that was running on jQuery had this weird kind of structure. We moved it to Vue and rebuilt it. Now, it provides a more granular experience and interaction with the UI, and so it significantly improved the UX. People tell us about it all the time.”

“With jQuery, the code would be very messy, hard to maintain,” Roman explains. “With Vue, it’s different, you’re able to harness the power of its components and start leveraging its ecosystem, like Vuex for example. What we do right now is page state management—something we have never done before, not in such a clean way.”

For Codeship, Angular testing was an incredibly painful process. With Vue.js, they know that their code is bulletproof.

“Vue.js seriously upgraded our testing protocols. We have Jest in place, which is a smart test runner for us. With Vue, we feel like we have way more control over every aspect of the app,” Roman elaborates.

“I can run 15 tests that try to perform specific actions. Such an approach allows me to easily identify code breaks. This is not something I could do this way in an acceptance test due to the sheer amount of time it would take to run. And the result is simply not worth the effort. Unit tests are great in that respect. Code-wise I know that it’s bulletproof, as we test it in a completely new way and it’s incredible.”
2

GitLabwww.gitlab.com

GitLab is an open core, integrated solution for the entire software development lifecycle.

Jacob SchatzFrontend Lead at GitLab“Every framework will struggle in certain areas. With Vue.js, every struggle will be your own, not Vue's. It's just a perfect framework.”

Challenge

After six years on the market, GitLab has established itself as a well-known solution for developers hailing from thousands of companies. Only two years back, most of its code was still written in Rails and jQuery.

“When I came in I saw that we have these individual jQuery things which were very simple, but for more complex things that we wanted to do, the really big ideas that we wanted to achieve, we would need something else.” Jacob explains,

“jQuery is fantastic, but it creates potentially more bugs as you’re responsible for literally every state change.”

To meet their goals, GitLab started looking for a new solution.

“We checked Backbone, which I had previous experience with, we obviously looked at React, but also Knockout, Ember, and all those different frameworks. I wanted to do a small project using each. By then I didn’t even bring up Vue.js at all!” Jacob recalls.

Testing all these frameworks helped Jacob identify their advantages and drawbacks.

“Backbone has a lot of tools to get stuff done and a good structure, but you’re still in the same boat as with jQuery. With React it scared me a bit to get involved with a framework that depended on a big company. Also, it didn’t seem to scale well for me. I really liked Mithril! The only problem is that it’s not pretty to write at all. If they could put a couple of extra layers of niceness on it, I’m sure people would start adopting it.”

Another big challenge was to make a mature switch to a new technology. It was a bit risky, and thus had to be well executed.

“In GitLab, we have tons of code. When I joined, there were already eight thousand lines of JavaScript in our codebase. I obviously didn’t want to do something that would be a complete rewrite. We actually still have some chunks of jQuery here and there.”

Solution

After testing a few frameworks, Jacob still didn’t have a perfect match on his hands. It was only after he wrote a pretty big project with an early version of Vue.js he realized that he may have struck gold.

“When I had this one project together, I knew it was something we could write a lot of code with. It wasn’t just about writing a simple to-do app. When you get to work on this large application—that’s where all problems actually start,” Jacob explains.

Before GitLab started diving into Vue.js, they needed a proof of concept.

“Phil Hughes [Sr. Frontend Engineer at GitLab], created a proof of concept where we took a major feature that we were doing—issue boards. Phil wrote that using Vue.js and it was immediately apparent that we got a tremendous amount done in a small amount of time! Without all those bugs which typically came with jQuery,” Jacob says.

Vue.js supports the approach evangelized by Jacob within his team—iterate small and create proofs of concept.

“We constantly have 4 or 5 proof of concepts going on,” he says

Using the same approach, GitLab introduced webpack to be able to split the assets into smaller chunks downloaded by the browser and thus improving the app load time.

“We created a small proof of concept to see if webpack was even feasible. When we found out that it was, we went the whole way and ended up writing and entire Trello application in Vue. And replacing the billion-dollar industry in one month. Good job, Phil!” Jacob laughs.

One feature of Vue.js turned out to be the most useful out of all—reactive templates.

“It’s a very, very simple thing that Vue does. One of the first things I programmed in GitLab was to take the issue page, and when you clicked close, you had to refresh the page. And now when you click close, it just changes the status of the merge button, changes the status of the button below. It does all those things automatically. In jQuery, there was a ton of code. At least 30-40 lines to make sure that the buttons were in the right state. With Vue.js it was literally one line of code. The view always reflects the current situation,” Jacob explains.

“And now that we use Vuex, it can be done better than before. The state management stuff made a HUGE difference.”

With all its advantages, Vue turned out to have one drawback.

“Currently, there are 15 developers at GitLab. With frameworks like Angular you kind of work in the same way together. Vue is much more open, and so we had to create documents explaining how we write in Vue.js. What patterns you’re going to follow. Still, it’s something that we’ve solved. The openness of Vue is also its beauty, but you need to make sure everyone’s on the same page.”

Outcome

Scaling up the application and introducing new features would be possible with jQuery, but it would be much harder to maintain.

“What we do right now would require a tremendous amount of code and a lot more organization. Vue has a lot of these problems solved,” Jacob says.

“With something as reactive as Vue.js, you give it a variable, and it’s going to bind it into the DOM directly and take care of everything else. Especially in Vue 2.0 with its virtual DOM. We wanted to increase our performance, and it was one way to simplify our workflow.”

Thanks to Vue.js, GitLab can iterate quickly and improve their usability.

“We can finally focus on usability and UX, where before we were focusing on little tiny things and code. Now we think about the much bigger picture.”

Vue.js is so open and accessible that it’s pure pleasure for GitLab frontend developers to deal with it on a daily basis.

“Vue, in contrast to other tools, does not follow any strict guidelines. It’s open and that’s fantastic. I like everything what it does right now. Of course, it’s got the most amazing documentation you can imagine. It’s really straightforward to get started with it and onboard new people.”

Vue.js helped GitLab improve time and cost efficiency.

“We know for a fact that our development is faster. That’s an easy thing to see. From the sales perspective, those nicer UX features we’re creating bring people to GitLab and make it a much more desirable product. People love the new things we put in there with Vue.js. We increase the user experience, and so we increase sales.”

Jacob agrees that they will definitely use Vue.js in the future.

“We’re all set! We have other challenges now. Currently, we’re trying to improve our process and speed up our testing. Vue.js solved so many problems for us that we’re definitely keeping it for the future.”
3

Livestormwww.livestorm.co

Livestorm is a all-in-one web-based webinar solution. It helps companies like Workable, Pipedrive or Instapage do live sales demo or customer training.

Gilles BertauxCo-founder & CEO at Livestorm“We didn’t have to spend a month setting everything up like with React, Vue had us operational in a week. We would never be at the point we are now if it weren’t for Vue. I’m 100% sure of that.”

Challenge

Unlike other webinar platforms, Livestorm renders everything in the browser. The service provides actionable insights through analytics, integration with popular CRMs, and marketing automation software.

For an app like this, Gilles and his team had to pick a high-performance tech stack. Starting from scratch, they were intent on validating their idea and building a stable and reliable product.

“The backbone of Livestorm is a Rails app—everything in backend is made with Ruby. For all our frontend components we chose Vue.js,” Gilles explains.

“We started working on our project in January of 2016 and from day one we knew we would be using Vue. We needed something that’s entirely open-source, highly performant, with a particular logic of components. Vue was the only framework that met all our requirements.”

A startup created by four co-founders, Livestorm sought to assemble a robust staff from the company’s very beginning.

“We thought a lot about hiring. There were only a handful of Vue.js developers in the Paris area where we work. We also considered recruiting developers proficient in other frameworks similar in structure to Vue, but in that case the onboarding process itself could have taken much longer and that was problematic for us.”

To build a successful live streaming product, the team had to focus on reliability.

“Reliability is a top priority for us. If you lose the live stream, webinars and demos crash and lose stream, our business basically makes no sense,” Gilles says.

“If the app’s down or there’s a bug making it impossible to use, we lose customers. We needed a technology that would somehow both guarantee top code quality and run really fast. We’re still working on implementing end-to-end unit testing. Something we haven’t done yet with Vue, it’s completely new to us.”

Solution

Most of developers still choose React and other popular frameworks, but Gilles believes there’s a shift coming.

“To hire experts for our staff, we attended Vue.js meetups in Paris, where we met highly experienced people. We also tried recruiting via job sites. Interestingly, most of the developers we spoke with said that they use Vue.js for their own side projects but their jobs have them working on a daily basis with Angular, React, and other frameworks. Often in big, well-established companies,” Gilles points out.

“One thing I’ve noticed, however, that companies often use these technologies because they’re forced to by legacy code or because they want to get a taste of this new hot tech everyone else is trying out. In the startup community, on multiple Slack channels and meetups I’m part of, CTOs and co-founders I spoke with who were interested in moving towards Vue.js were very excited with the fact that we’ve chosen Vue at Livestorm and have been asking a lot of questions about it. Frankly, I believe there’s a significant shift coming—people will be more interested in moving towards something reliable and high performance, like Vue.js, while hyped technologies like React will gradually wane in popularity until they’re finally phased out,” Gilles adds thoughtfully.

As Gilles wanted to put his product out there as quickly as possible, the team created a quick MVP to get some initial feedback from the outside world.

“We spent less than a month building the first MVP. It was enough to present the product and the basic concept. In the end, we got a lot of positive feedback, which confirmed that we have a market fit,” he recalls.

“It took us 5 months to sell the first subscription. That’s quite long, but we needed to first work through some stuff that was not necessarily technology-related.”

The list of features that Gilles’ team built into their platform to make it a competitive solution is really awe-inspiring.

“WebRTC real-time streaming, full HD streaming during live sessions, webcam and screen sharing are the primary video-related features. We also offer an analytics-focused section that runs on Vue.js and integration with popular sales and marketing tools like Salesforce. We also developed a one-of-a-kind feature that no other browser-based webinar software has, which allows users to switch, on-the-fly, from WebRTC to HLS to make the stream compatible with Internet Explorer users and a range of mobile devices.”

Outcome

After a year on the market, Livestorm has customers from all over the globe and a profitable product.

“We have around 150 paying customers. They are all impressed with how fast Livestorm is, they also love the UI and UX. Business-wise, we have an app that runs on its own, without our interference, so to speak—we don’t have a sales team. We have a staff of seven, including product experts, engineers, and one marketing person. That would be me. But just because the product is that good and reliable, we grow by 20-30% each month.” Gilles explains.

With Vue.js, Livestorm can release new features faster to the delight of their customers.

“We try to ship new things as fast as possible, of course. Right now, we’re two months into a phase that will conclude with the release of a big feature we’re working on, but we usually ship features in a week or two,” Gilles elaborates.

“With Vue.js we don’t have to reinvent the wheel every single time. We can reuse all the components we already have to speed up the development. Currently, 39.5% of our our codebase is built with Vue.”

Gilles claims that choosing Vue.js over other frameworks made his company succeed faster.

“Only benchmarks tell the truth and right now the benchmarks clearly demonstrate that Vue.js is definitely the choice for new and existing products. So if anyone has to make a technology choice in the near future, they should rely on concrete facts, figures, and benchmarks rather than opinions,” he says.

“If you have a lot of developers on staff who are used to Angular or the more classic frameworks, having them shift to React may be painful for the entire team. Transitioning to Vue, on the other hand, is much smoother, which in turn translates to lower costs. We didn’t have to spend a month setting everything up like with React, Vue had us operational in a week. We would never be at the point we are now if it weren’t for Vue. I’m 100% sure of that.”
5

Vue.js vs. the Rest of the JavaScript World

Everything that has been already said on the web in one place.

 

You’ve probably seen dozens of those “Vue.js vs. React vs. Angular—the ultimate final supreme dance off you have to read” things. Nevertheless, that particular comparison neatly (but not exactly) lines up with what we’d like to explore in this section. Thus, we won’t be putting forward any original thoughts, as everything has already been said online; instead, we will condense all these thinkpieces scattered across the Internet into a comprehensive, concise chapter that will offer you a more complete look at the “The Big Three.”

After reading this piece, you will hopefully understand why some developers/companies chose Vue, React or Angular, and the reasoning behind these decisions.

However, rather than dive into technical details, we’d like to delve more into the business side of things this time around. Sounds good?

Just to be clear, there are probably many great frameworks out there that will fit your product fine and it shouldn’t matter how popular a technology is or which one is the most hyped. At some point of working with a particular framework, you’ll surely realize that it isn’t the best tool in the world. Just make sure yours is a truly educated decision and then check whether you’re absolutely sure of your choice.

Okay. I want to introduce you to Vue.js, AngularJS, and React.js, three of the popular frameworks nowadays.

Luis Elizondo published an amazing write-up on why his company, Rever, has moved from Angular 2 to Vue.js suggesting some very nifty criteria that we will also adopt here (changing them just a bit; well, okay, changing them a lot, but his piece was a great inspiration to us):

  1. Stability
  2. Flexibility
  3. Backing & general popularity
  4. Documentation
  5. Simplicity
  6. Size
  1. Scalability
  2. Coding speed
  3. Job market
  4. Forecast for next months
  5. Popular app examples

You may also want to have a look at the JavaScript web frameworks benchmark before making a decision.

Let’s dive in!
1

Stability

“Looking at the project’s (Vue.js) history on GitHub, you will see a rock solid track record of consistent releases of new features and improvements, prompt bug fixes, and a meticulous standard for code quality (yes, we maintain 100% test coverage).” - Evan You

“I've been using React for about 3 years, and I don't recall many times I had to make major changes due to a React upgrade. The rest of the ecosystem (react-router and various flux libraries) is a different story though.” - rwbcxrz (reddit)

“Angular is easy to scale thanks to its design as well as a powerful CLI. (...) Vue being just behind react, it is a good choice however it lacks a list of best scaling practices, resulting in a lot of spaghetti code.” - Dominik T
2

Flexibility

“Developers who don’t like to listen to opinionated frameworks gladly adopt Vue for their projects. However, there are developers who prefer to choose Angular.js because they prefer a support in order to make decisions on the overall structure of their apps. This would help them save time for coding.” - Cabot Technology Solutions

“React is ideal for almost any platform. Whether it’s web or native development, React has you covered and is maturing in both directions. The benefit is being a flexible developer in any context when it comes to UI development.” - Pavel Malos

“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. Many developers enjoy this freedom, while some prefer having only one Right Way to build any application.” - vuejs.org
3

Backing & general popularity

“If you’re in the market for a shiny new JavaScript UI framework, you can’t go wrong with either React or Vue. While React seems to be more popular, Vue is gaining popularity and isn’t going anywhere.” - Peter Tasker

“React's ecosystem is huge, and seems to be where all the "cool kids" are playing these days (at least here in SF).” - Jeff Schnitzer

“Vue may have some advantages since it came after React, so they were able to avoid some of the mistakes that React made, but on the flip side, React is more popular so it has a bigger community which means more open source projects, more jobs, more stack overflow posts, more people testing and using it in production. Plus React is sponsored by Facebook who has done a great job fixing issues and continually improving the framework.” - Austin Sheppard (Quora comment)

“The two biggest software development corporations, Google and Microsoft, are behind Angular development. Being close to the Microsoft ecosystem, and given the openness of Microsoft, I see more and more involvement of the community folks. React on the other hand was a Facebook initiative (...). Facebook is not a software development company. Can React survive without support of corporations other than Facebook?” - Mahesh Chand

“The Angular ecosystem is more controlled, more stable. There is an Angular Way to do things. That's probably partly why Angular has a more "corporate" image. And this image has been emphasized with the usage of static types using TypeScript, which resonates with backend developers familiar with types from languages like C# or Java.” - 2017 JavaScript Rising Stars
4

Documentation

To have proper speed we needed good documentation and Vue.js documentation is superb. Guides, examples, questions and API are documented really well and cover all of the doubts we found during development.” - Luis Elizondo

“React has a steep learning curve. Its documentation and terminology around certain concepts is a bit unconventional and messy, where Vue’s Guide, property names, setup process, etc. all feels very familiar and in line with broader HTML, CSS, and ES6 standards. Thankfully for both frameworks, their communities are thriving.” - Pavel Malos

“Angular2's documentation is amazing -- but it really needs to be. The API footprint is large and there are many concepts to learn. Fortunately there is a tutorial for seemingly every eventuality, although some of them are slightly out of date. Don't expect to become an angular expert overnight.” - Jeff Schnitzer
5

Simplicity

“Though a few of the syntaxes of Vue and Angular are similar, like API and design (this is because Vue was actually inspired from Angular.js in its early stages of development), Vue has endeavored to improve itself in areas where developers find it difficult with Angular. You can build a non-trivial app with Vue.js in a few hours; this is not possible with Angular.js.” - Cabot Technology Solutions

“Generally speaking, ReactJS is easier (than Vue) because it has more stackoverflows to answer your questions. In Vue, what do you do? At a fair amount of occasions, I have to open my node_modules folder and read the source code.” - Mark Chen (Quora)

“React is the simplest, in both good and bad ways. It's pretty easy to understand how everything works, yeay. React requires quite a bit more code than the others, boo.” - Jeff Schnitzer

“Understanding Vue.js properties like methods, computed, properties, data and created takes you to about 90% of what you need to understand to start coding, really easy.” - Luis Elionzo

“React has a steep learning curve. Its documentation and terminology around certain concepts is a bit unconventional and messy, where Vue’s Guide, property names, setup process, etc. all feels very familiar and in line with broader HTML, CSS, and ES6 standards. Thankfully for both frameworks, their communities are thriving. You can find tons of resources to get started” - Andy Merskin (Quora)
6

Size/Performance

 Vue has great performance and the deepest memory allocation, but all these frameworks are really pretty close to each other when compared to particularly slow or fast frameworks (like Inferno).” - Jens Neuhaus
7

Scalability

“I’m not sure why people keep saying that Vue is less appropriate than React when dealing with large system. They both use virtual dom, have state manager library, and their own communities to do everything impossible.” - Mark Chen

“Your first choice would be Angular.js if the aim is to build large and complex application because it offers complete and comprehensive solution for client-side app development.” - Cabot Technology Solutions

“Angular.js would also be good for developers creating heavy web applications with several components and complex requirements. When you choose Angular, native developers find it easier to understand the application functionality and coding structure.” - Cabot Technology Solutions

“The good thing about the Angular framework is that a new Angular 2 developer from another company will quickly familiarize themselves with all the requisite conventions. React projects are each different in terms of architectural decisions, and developers need to get familiar with the particular project setup.” - Jens Neuhaus
8

Coding speed

Angular although being very competitive, the amount of unnecessary syntax it requires to do simple things puts angular in the last place. (behind React and Vue)” - Dominik T

“A fast-paced environment means that we need people to be able to jump quickly into new tools. Sometimes we also need to work with external contractors, so the perfect solution for us was something easy to learn and start working with. Vue gives us a lot of flexibility in terms of workflow—for example being able to work with already known preprocessors for HTML and CSS is a big plus.” - Sylvain Simao

“Given our extended experience with Angular, introducing Vue was a breeze. My fellow co-workers were able to pick it up and start writing apps in a matter of hours/days, thanks to it feeling super familiar to what they already knew.” - Damian Dulisz
9

Job market

“In the job listings, React completely took off and blew right past jQuery — the first library to pass jQuery in job popularity in a decade. What we’re witnessing here is the end of an era.” - Eric Elliott

“To hire experts for our staff, we attended Vue.js meetups in Paris, where we met highly experienced people. We also tried recruiting via job sites. Interestingly, most of the developers we spoke with said that they use Vue.js for their own side projects but their jobs have them working on a daily basis with Angular, React, and other frameworks. Often in big, well-established companies” - Gilles Bertaux
10

Forecast for next months

“Vue.js did do very well in 2017. It got a lot of headlines and a lot of people got interested. As I predicted, it did not come close to unseating React, and I’m confident to predict it won’t unseat React in 2018, either. That said, it could overtake Angular in 2018” - Eric Elliott

“This time last year, not many had faith that Vue would ever become a big competitor to React when it comes to company adoption, but it was impossible to ignore Vue this year, even sending Angular into the shadows in terms of developer hype. As we look ahead to 2018, we're about to embark on an intense 2 years filled with a lot of excitement for Vue.” - Ryan Chartrand

“(...)2018 will see the rise in creation of Native apps, which remains a key area of improvement for Angular. It would be interesting how Angular 5+ shapes up in 2018 and whether it breaks through the React domination. (...) 2018 will likely see the rewrite of the entire (React) framework as announced by Facebook, codenamed React Fiber. Hope this doesn't get botched up the Angular did.” - Kakul Chandra (Quora)
11

Popular apps examples

Angular:
Upwork, The Guardian, iStock, PayPal, YouTube

React:
Facebook, Netflix, Instagram, WhatsApp, Dropbox

Vue.js:
GitLab, Codeship, Alibaba, Nintendo, Sainsbury’s

As this chapter gives you a lot to absorb, we distilled its contents into this helpful, nice-lookin’ table. As the table only offers a somewhat abridged version of the comparison outlined above, it may lack some important points or pieces of information, and may be biased by our own feelings towards those frameworks.

Just so you know—although we recommend Vue.js to most of our incoming clients, here at Monterail we use all three frameworks, always going with the one that best fits a given project, a process which requires a lot of digging and additional analyses . But hey, if you’re looking for key differences between the three, this summary is a great start!
Angular
React
Vue.js
Stability
Yes
Yes
Yes
Flexibility
Not really flexible—highly opinionated
Highly flexible (yet less than Vue)
Highly flexible
Backing & general
Backed by Google, widely adopted, has “corporation framework” image
Backed by Facebook, widely adopted and popular among new businesses
Community-driven, big and growing in popularity
Popularity
Well-developed
Well-developed, but may seem complex
Well-developed
Documentation
Quite difficult to master
Quite easy to master
The easiest to master
Performance
Quite performant, but can get heavy
Highly performant
Highly performant
Scalability
Recommended for big projects. Code is easy to understand to native developers.
Highly testable and scalable
May lack a list of best scaling practices, but works just fine for big projects.
Coding speed
Quite slow
Normal
High
Job market
Many developers and job offers on the market
Many developers and job offers on the market (more than Angular and Vue)
A big, rapidly growing number of Vue.js developers
Forecast for next months
Moderate growth, no upcoming rewrites, some breaking changes with new major version releases
Stable growth, incremental updates with performance improvements and bug fixes
Moderate growth, rise in commercial usage, Vue.js 3 release
Popular apps examples
Upwork, The Guardian, iStock, PayPal, YouTube
Facebook, Netflix, Instagram, WhatsApp, Dropbox
GitLab, Codeship, Alibaba, Nintendo, Sainsbury’s

Here’s a full list of articles and sources we quoted in this chapter:
6

What’s the Future Of Vue.js?

Vue.js has come a long way to become what it is today and it has some big plans for the future. If you’re still worried about its longevity, fear no more.

 

On September 20, 2017, the Vue.js core team hosted an AMA session, answering a host of questions about Vue itself and their plans for the upcoming months. This was a great source of information on what will be happening in the Vue world in the near future. If you want to stay up to date with what’s going on with Vue, there’s a public Vue Project Roadmap you can check out.

This chapter will help you understand why you should not be worried about continuity of the framework and what can you expect in the upcoming months.

Vue.js Longevity

You probably have noticed by now that Vue.js is not owned by any major corporation (shocker, right?). For many developers and companies, it’s one of the key reasons for not selecting Vue for their project and choosing React or Angular, both corporate-backed frameworks, instead.

But what does it actually mean? It means that Vue is not a for-profit business, but a community-driven project. From its very beginning, it was meant to be a project by developers for developers, and the entire core team continues to stick by that mission, making Vue one of the most popular frameworks of all time. Saying that Vue is a “one man project” is wildly inaccurate, as Vue surpassed critical mass a long time ago and it’s longevity should no longer be a concern.

According to Chris Fritz “We're not supported by a single company with a single perspective and use case, but by many companies and individuals, all over the world, with wildly varying needs.”

So if you’re asking whether Vue will be sticking around, the answer is an emphatic yes. As long as developers and businesses are keen to use it, Vue will be developed and maintained by the core team and the community.

Native Vue?

Almost a quarter of all people who filled out the survey featured in State of Vue.js 2019, mentioned the lack of a popular native development platform as one of the chiefs doubt plaguing them when pondering the addition of Vue.js to their technology stack.

There are a couple of ways a developer can choose when creating a cross-platform mobile app with Vue. But there are  two most popular frameworks: NativeScript-Vue and Vue Native (NativeScript being a winner here).

Vue Native is a relative newcomer to the JS mobile development framework group. It has sparked over 2,500 projects within only days of its GitHub premier. In essence, a Vue Native is a wrapper around React Native APIs. It brings together React Native and Vue.js, letting developers take the best of each and build apps with rich UI.

NativeScript + Vue is a NativeScript plugin that allows developers to use Vue.js syntax. It has an extensive documentation and adheres to all the standards that are present in NativeScript development.

Vue.js 3

The latest big release of version 3.2 - „Quintessential Quintuplets” took place in August 2021 and six months later it became the default version. Vue 3.2 has continued to improve performance and add features for Single File Components. Many libraries embraced Vue 3 and added support for it, while others have compatible releases on the way.

Here are some of the exciting developments we could observe in Vue ecosystem:

  • We had the first stable release of Vite - a new kind of build tool for frontend development. Vite brings a combination of blazing-fast development experience and highly optimized production bundles. It’s also framework agnostic and anyone can use it! Vite is the new recommended choice, while Vue CLI enters maintenance mode.
  • Following the naming convention, we have also seen the release of Vitest - a new unit-test framework powered by Vite, which brings its blazing fast speed to subsequent test runs, making it a fantastic choice for a TDD approach.
  • Pinia released its first stable version and it is now the recommended library for state management in Vue 3. Introducing a simpler API, proper TypeScript support, and utilizing hot module replacement, it’s a huge step up in the development experience. While Vuex is still compatible with Vue 3, it is now in maintenance mode.
  • Volar was released as the new official development tooling for our IDEs. It’s a huge step up in terms of full TypeScript support inside Single File Components and performance. It also provides cross-component props validation and type checking in our templates out of the box.
  • Recently Vue Version 3 became the new default! Potentially requiring some actions in projects using Vue version 2 as the latest version will now point to Vue 3
  • With this, we have also seen the release of new Vue docs overhauling the design, UX and introducing new guides as well as a feature to toggle between Options API & Composition API. This version also introduced an interactive tutorial that walks you through all the major features of Vue. It’s never been a better time for newcomers to try and learn Vue.

The continued updating and improving of the Vue JS open source framework proves it remains a solid technology choice for projects going into the future. Backwards compatibility with previous versions ensures stability when it comes to updating and adding features to already complete projects. For a full overview of new features and changes in Vue 3 check out the full introduction document from Vue’s website.

Vision

In State of Vue.js, Evan You outlined what his primary goal was when he started working on Vue.js and how he envisioned its future:

“Many people have asked me why I started working on Vue.js. To be honest, the original goal was to ‘scratch my own itch,’ to create a frontend library that I would enjoy using myself. As Vue got adopted by more and more users along this journey, I received many messages from users telling me that Vue has made their work much more enjoyable, so it seems my preference happens to align with that of many fellow Web developers.

Today, I envision Vue’s goal to be helping more developers enjoy building apps on the Web. I believe that happier developers are more productive, and ultimately create more value for everyone. The goal entails delivering a framework that is approachable, intuitive, and at the same time solid, powerful, and scalable. I believe we are on the right track, but there is also a lot more we can do, especially with the Web platform evolving faster than ever before. We are excited for what’s yet to come.”
Services
Projects
Company
Careers
Contact
[email protected]+48 533 600 136
Copyright © 2023 Monterail sp. z o.o.