Angular vs. React vs. Vue: A 2018 Comparison

2018-Javascript-Frameworks-Comparison-Angularjs-Reactjs-Vuejs

This is a challenging post to write, but we’re sure you must have faced problems dealing with JavaScript frameworks in the past and chances are, you must’ve been confused regarding which one to use.

If you’re having trouble deciding between Angular, React or the new kid in the block, Vue, we’re here to help.

Let’s cut to the chase and compare the three below.

1. Developer’s View

 

Vue, being the dark horse of JavaScript Frameworks has been developed by a team of dozen developers while Angular and React been popularly used by giants like Facebook, Reddit, Airbnb, Netflix, and Google.

Vue’s become a trending sensation since its release and has a small team of developers.

Clean code and lesser over-engineered snippets are its highlights.

According to a number of developers, Vue is a lightweight and flexible alternative to Angular JS.

Angular 6 updates

According to an annual StackOverflow survey taken by 64,000 developers in January 2017, Angular JS was preferred by 52% developers while React was loved by a staggering 67% of the community.

Vue was relatively unknown and is gaining awareness.

2. Coding And Performance

 

If you’re switching from SPA to Microservices, React, and Vue works like charms by using components of former applications.

React comes integrated with Redux while Vue offers Vuex.

Two-way data binding is provided by Angular where model states change according to UI elemental states.

With React, data flow is one-directional only.

Vue offers users both one-way and two-way data binding, with its one-way data binding mode being the default state.

Native-rendered apps for iOS and Android can be written in React, while Vue officially collaborates with Weex to author components written in JavaScript syntax which can be run on both web browsers and native apps!

Developers will soon be getting NativeScript as another cross-platform option.

Regarding size, Angular has a bloated file size of 143k while Vue stands at 23k and React at 43k.

Both React and Vue include a virtual DOM with Vue excelling in deep memory allocations, according to performance benchmarks.

Regarding rendering speeds and performance tests, here’s a chart that lists performance benchmarks of all the three for more clarity.

Performance Comparison Between Angular, React, And Vue 

Source: Stefankrause.net

 

3. Backward Compatibility

 

Regarding Agileness, React wins the race with upgrades being flexible and providing developers an abundant ecosystem of renderers.

Angular Vs React Vs Vue - Guide

Angular JS is a complete framework and relies on updates to previous versions and components while React offers excellent backward compatibility, allows its libraries to be paired with other packages, and even promises legacy migrations.

Vue wins regarding mobility and modularity.

Regarding Angular, long-term support versions are only available from Angular 4.

4. Learning Curve

 

For junior developers and collaboration between team members of enterprise projects, Vue was rated the simplest and easiest to understand for budding programmers.

The learning curve is steep for Angular while React, and Vue’s provide faster development times and quicker debugging solutions.

For inexperienced JavaScript developers who have primarily worked with jQuery previously, using Vue is a lifesaver as it resembles plain JavaScript with the introduction of existing ideas.

The Verdict

 

For those who love massive ecosystems and more flexibility, React is the way to go.

Angular uses TypeScript and is ideal for programmers with a solid Object-Oriented Programming (OOP) background who need detailed guidance and structure while Vue is relatively simple to pick up and integrate for a small team of core developers.

You can read about our latest blog on Angular 6 here – https://hubs.ly/H0bCJT50

Liked this post? Which ones are you using? Are you looking to make a switch or modernizing your existing ones? Let us know in the comments!

  • Pingback: Top 3 Best JavaScript Frameworks in 2018 – Cuelogic Blog()

  • John Furr

    I just converted my wife’s django website (https://teaquinox.com/) to a Vue.js frontend. The reason I chose Vue is because Vue was trivial to integrate immediately onto production pages. I didn’t have to do anything but add a script tag and start working, AND this was supported by and recommended by the Vue community. No npm, no webpack, no babel, etc, etc.

    I fell in love with Vue almost right away.

    Flash forward a month later and the whole site is now converted to standard Vue single file components using npm, webpack, and bable to produce minified bundles, and yes jQuery has been totally remove now! 🙂 The code is cleaner and better organized into components. Page loads are dramatically faster with single minified bundles.

    The thing is I could easily switch to something like React or Angular now that I have learned all the build tools and such, but with Vue I was able to start immediately making changes to my wife’s website allowing me to focus on productive changes while only having to learn one new tool at a time. Once I saw Vue’s power I dove in deeper…and down the javascript rabbit hole I went.

    BTW I won’t comment one which framework is better when you start from scratch, but I am strongly opinionated about which of the three should be chosen if you want a seamless integration into an existing standard website. I spent a lot of time reading docs and looking at other angular and react projects before going with Vue. I have no regrets at all.

    • Texas Arcane

      Identical to my experience with Vue. Both Angular and React are becoming priest cults of complexity.

      • Hitesh Agja

        Once you use React, you won’t use any other framework/lib, believe me.

        • Texas Arcane

          I agree. It is simply the right way to solve the problem.

    • CoolDarthVader

      Same here … developing an app for corp as a side project … to be honest, I have only worked with Angular 1.x … so maybe ng2 is much better. But I found it very difficult to grok angular concepts. With Vue, it was a breeze to get a basic app up and running and the component logic just seems so much cleaner. It’s VUE for me .. at least for now. Though I have to say .. angular’s PrimeNG is a very sweet looking UI framework compared to Vuetify that I’m using right now.

    • Freddie Karlbom

      Yes! To me, it seems obvious that Vues focus on progressive enhancement rather than a lock-in solution that determines your whole frontend stack has a lot of benefits.

    • Joel

      Hey John, your site is running on debug mode.
      This means that if someone where to cause a stack trace it would print all of your environment settings, including passwords, usernames, directories, etc.

      From the Django docs:

      You must never enable debug in production.

      You’re certainly developing your project with DEBUG = True, since this enables handy features like full tracebacks in your browser.

      For a production environment, though, this is a really bad idea, because it leaks lots of information about your project: excerpts of your source code, local variables, settings, libraries used, etc.

      For your site safety please go through https://docs.djangoproject.com/en/2.0/howto/deployment/checklist/

      • John Furr

        Hey Joel, thank you so much!

        I can’t believe this got past code review. Thankfully I believe this happened this morning with a new change we pushed out.

        Thanks again man. It’s nice to know the world still has good guy’s around!

  • Diana

    I’ve reading this “Vue popularity is growing!” thing for about 3 years, and I’ve seen no change. The fact is that Vue is used only by a few Chinese companies (Vue’s author is Chinese) and a bunch of hipsters who develop small frontends. Angular and React are aimed at big projects: they can be trusted. Plus, the people who evangelize Vue remind me of those mormons who knock at my door saying “excuse me, do you have a minute to talk about our savior lord Vuejs?”. What do you do? You say “NO” and shut the door.

    • Rodney Barbati

      People that are 100% convinced they know the answer and so don’t need to consider alternatives remind me of mormons who knock on my door.

    • João Cagnoni

      So Vue.js is a bad framework only because it’s used by a few people? There are only a few women programming, are them bad programmers too?

      • Tony Cossio

        Yes, the less people who use it, the less support and development it gets. In the CS field where things are evolving at a furious pace, that’s a big issue.

        • Yes, but getting less attention, support and development doesn’t mean it’s not as good as the others. It is the fact that Angular and React are supported by big companies what makes them receive more attention.

      • Commenter4376

        This is the worst analogy I’ve ever read.

      • Texas Arcane

        Yes, because if it was any good there’d be more people using it! Just like electricity and underwear, two other newfangled jimmydoodles that are nothing but a passing fad!

        P.S. If Vue was more backwards compatible it would vaporize both Angular and React in usability and maintainability. Angular and React appeal to people too lazy to learn how to build SPAs properly with JQuery.

    • Maybe next time just comment on the article without disparaging another religion. It adds nothing to your insight, and only diminishes your credibility.

    • xiwi

      Is always good to find new and interesting things but we have to keep this for small projects. This can’t be used on a corporative project across different teams.
      For me the most important thing of a framework is the documentation. It doesn’t really matter at the end if a new framework is 0.5s faster than the one you’re using if no one is gonna use it in one year or the official documentation is shit. As developers we know that we spend sometimes more time on Stackoverflow than coding.

      Angular to me is a real winner in this aspect.

      • Texas Arcane

        It’s true. Vue is largely undocumented at this point.

        • Diego Lipinski

          You’re just a hater lol

        • mbokil

          VueJS has some of the best documentation I have seen for a library. Have you seen the site? It is amazingly complete and easy to follow.

    • John Furr

      “The fact is that Vue is used only by a few Chinese companies …”

      Well we use it at Harvard for the HBX online education platform…

      • hhvdblom

        It takes 3 years before people realize Angular/React don’t solve problems but create new problems. Still developers want a framework and whats better than a lean-and-clean framework like Vue. So now Vue is really getting momentum.

      • mbokil

        We also use VueJS at our medical company and it is spreading quickly among developers since it is easy to learn, performs well, and allows us to create reusable component libraries.

    • Chinese, hipsters, a definition of trust and religions mixed together in one comment, wow, trolls are really getting creative these days.

      • mbokil

        I am a Bostonian old fart so the generalization has already failed as I use VueJS daily now.

    • mbokil

      I work for a large medical company and we started moving our legacy JSP/JS apps to VueJS. We have 2 apps converted so far and they are working great. VueJS had a distinct advantage for us over React since we had older Angular 1 apps with a lot of HTML templates. We could copy/paste the template code into a single file component and add the logic. The new VueJS apps will be used by 56K embedded machines running Firefox. I am also a Bostonian and there are no Chinese developers on our team.

  • Dwight Spencer

    Only Angular (i.e. not Angular JS) is enterprise-ready, in sync for the coming ES8 Javascript, and preferred for high-traffic sites. And look at the performance numbers above: Angular 4 soundly beats React – and Angular 5 is the optimization release that is considerably even faster than version 4. And as is implied in The Verdict, React is great if you love making a “software stew”, while Angular is a heavy-duty do-everything performant tool for the experienced engineer.

    • Rodney Barbati

      Like I said above, if the basic building block is a single file encapsulated component, as it is in vue, then the solution is to create as many components as you need. Vue lets you do that quicker, faster and with less overhead than any competitor, and your team will be able to pick it up in a half hour. On the con side, the experienced engineers you mention won’t be able to claim superiority of knowledge and capabilities using vue – it’s too easy to pick up. If you know HTML, CSS and javascript, and understand what encapsulation means, you already know everything you need to use vue.

    • John Furr

      “Only Angular (i.e. not Angular JS) is enterprise-ready”

      Cause facebook is not enterprise ready I guess….

      I can use google, and I have, but I’d be curious if you could post some links that you have seen showing Angular outperform React..and I’d REALLY like to see the papers that show Angular outperforming Vue which seems to outperform React (marginally) in most tests I’ve seen.

      BTW. I hate the holy wars. Angular, React and Vue or literally just words to me. They are the nails that build the house… Anyone working with React will pick up Angular or Vue in a matter of a week and vice verse… We all benefit for a larger ecosystem being pushed forward.. For me though. Vue takes the cake for integrating into standard websites.

      For what it’s worth I’m also the lead engineer for Harvards HBX online education platform and we are integrating Vue.js in more and more and replacing the old backbone infrastructure (before my time). I looked long and hard at both Angular and React. Neither of them was easy to integrate immediately without a lot of rewriting and retooling. That simply was not the case with Vue.

      Just one more note… when it comes to ‘performance’.. I can only think of a few platforms were jQuery is not performant enough..Yes seriously.

  • Rodney Barbati

    I worked with Angular for over 2 years solid, and created a very sophisticated dynamic forms system using it. That being said, Vue kicks it’s butt in every conceivable way. Vue is a pleasure to work with, takes an average developer about 15 minutes to become productive using it, and handles all the most complex cross component communication issues with an ease that is hard to believe until you actually see it.

    The bottom line is that you will be hard pressed to even conceive of a simpler solution to what you want to do. There is virtually no overhead with vue – a couple of keywords or attributes is all you will ever specify above and beyond the code needed to implement your desired functionality.

    The thing about the “trustworthy-ness” of angular and react for big projects is a non-starter. Regardless of the project size, if you are using Vue, you will develop completely encapsulated single file components and data models that can be easily be inherited or used by other components and data models. The code for these components will be smaller, faster and easier to understand, modify and debug than the competition. A brand new developer would be able to understand the architecture of your UI solution, regardless of size, the moment he understands the structure of a single component – which is how ever long it takes him/her to understand that there are 4 keywords/tags you use in a component – one to import your dependencies, one wrap your html, one to wrap your css and one to wrap your javascript. This is about 15 minutes typically. The next thing they need to understand is one of the 3 methods to communicate with other components. That takes about 15 minutes as well as each of them require a line of code to use.

    It takes from 0 to 5 commands to create a new project – from there you can grow into as much or as little of vue as you need. Want to use it for a single component on a page, then just include the js file and your javascript and go. Or create single file components and data models that scale out as far and as wide as you need using the same simple techniques you used to create your first component.

    The truth is this – it doesn’t matter how big a project is when the basic unit of construction is the same regardless of project size. You simply repeat as necessary. And nothing out there has a basic unit of construction more straightforward and non-constraining than vue.

    If you somehow can’t manage a set of distinct and completely encapsulated components and data models necessary for a ginormous project, then it doesn’t matter what technology you choose, your project will be a failure anyway.

  • X’alilof

    Angular can not be compared to React one is framework the other is a library…
    you talk about Angular size!, angular’s core features will require React to add-up some extra 5 – unofficial third-party libraries in order to achieve the same.
    We used both React and Angular in real world projects, they both has different usages and scenarios.
    about Vue.js… -_- no Comment

    • hhvdblom

      Yet… even you will comment… after you will have seen the Light 🙂

  • Ripulryu

    I’ve used Vue.js, Angular2/4/5 and ReactJS, in the same order and found each of them a great tool to work with. Vue is great for smaller projects, For Angular you need everything the Angular way, it is great especially for making mobile Apps (Ionic). ReactJS is the next big thing for web after it became MIT licensed. I’ve dropped Angular and Vue in favour of react, I find it more conceptual and far more maintainable for big projects than Vue or Angular.

    • Najam Ul Abideen

      Iv found performance and rendering issues in ionic framework. Better choose React Native.

  • Chris Wilson

    I’ve been learning React recently (coming from Angular) and I’ve found that there is a lot more work involved with pretty much every aspect. Forms, their validation, checking validity all have to be done manually vs. Angular’s FormsModule or ReactiveFormsModule. I’ll grant that you get more flexibility with React but that can end up being an issue with more than one developer working on a project. Obviously there are many companies who prefer React, just in my opinion I want to create the project, start building the project instead of choosing fetch() over axios or how to handle state. Angular’s services are super handy and if you have a really big app you can always implement ngRx. I’ll keep going with React for now, maybe my opinion will change in the future.

  • Mark Berg

    A great capture of the evolving framework, thanks for sharing!

    Choosing one over other frameworks are difficult. In fact, they are designed for different users with different demands. If you admire vast ecosystems and flexibility or if you fancy a dozen of packages, react is the right choice. As you said, Angularjs make use of Typescript and is ideal for those who have a strong grasp of Object-Oriented Programming (OOP), who craves detailed guidance and structure. Unlike these frameworks, Vue is the simplest of all. It is perfect for entry-level developers, it is adequate to integrate for a small team of core developers.

    Refer my publication, the same niche topic explained briefly the comparison of react.js, angular.js, and vue.js, http://customwebsitedevelopement.blogspot.com/2018/04/reactjsvsangularjsvsvuejs.html