If you want to design manageable and flexible web applications, you may want to take a look at React, Vue.js, and Angular frameworks. Before starting the comparison, let me briefly discuss these great frameworks.
Angular is a platform and framework for building single-page client applications using HTML and TypeScript. Angular is written in TypeScript. It implements core and optional functionality as a set of TypeScript libraries that you import into your applications.
Angular supports two-way binding, two-way binding gives components in your application a way to share data. Use two-way binding to listen for events and update values simultaneously between parent and child components and more.
Used by powerful companies like Paypal, Google, Udacity.
- It has its own unit and e2e testing tool (Jasmine & Karma)
- It has a powerful routing
- There is an Apollo Library for GraphQL
- Supports mobile development with Ionic
- NgRx library can be used instead of Redux
- Standalone framework
- Services and Dependency Injection (DI)
- Two-way binding
- Verbose and complex
- Steep learning curve
- Version update is painful (Angular.js to Angular 2..14)
- It compiles useful or not all components at runtime
- The file size is a little bit higher than other frameworks
- Limited SEO options
- CLI documentation is lacking details
- Doesn’t have VirtualDOM
React uses a declarative paradigm that makes it easier to reason about your application and aims to be both efficient and flexible. It designs simple views for each state in your application, and React will efficiently update and render just the right component when your data changes.
Used by powerful companies like Facebook, Netflix, Uber.
Note: React is not a framework. It is just a library developed by Facebook to solve some problems that we were facing earlier.
- Powerful community, tutorial, documentation
- Fast renewal and update
- Uses all new features of ES6
- Easy to learn, reusable components
- Easy creation with Create React App
- A rich resource of unit testing
- Native mobile support also includes Ionic
- State management also supports Redux, Recoil
- JSX syntax
- The high pace of development
- Somewhat slow documentation.
Vue.js core library focuses only on the View layer. It is called a progressive frame, because you can extend its functionality with official and third-party packages, such as Vue Router or Vuex, to convert it into a real frame.
Vue is not strictly associated with the MVVM (Model-View-ViewModel) pattern, its design was partly inspired by it.
With Vue, you’ll be working mostly on the ViewModel layer, to make sure that the application data is processed in a way that allows the framework to render an up-to-date View.
It was launched in 2014 by Google employee Evan You.
Used by powerful companies like Alibaba, Trustpilot, GitLab.
- Good documentation
- Two-way binding
- Simple unit testing
- Native mobile support with NativeScript
- Standalone framework
- Faster than alternative frameworks
- Easy to upgrade version
- Poor community than alternatives
- Release periods are relatively slowly
- Not enough English documents
- Poor developer team
Angular is developed by Google. It’s often used in enterprise projects, and it powers over 98k websites based on BuiltWith‘s data.
It’s the least starred among the three frameworks, with 82.7k stars on GitHub. However, when switching from Angular 1 to Angular 2, they created an entirely new repository instead of continuing the AngularJS project, which also has 59.4k stars.
Out of the three frameworks, Vue has the most stars on GitHub, with 198k stars. It’s a very strong, independent project in the open-source community and is used by over 1 million websites, according to BuiltWith.
Angular, React, and Vue can all be used to develop Progressive Web Apps, also known as PWAs.
PWAs are not mobile applications but web applications that smartphone users can add as shortcuts to their home screen and offer a look and feel similar to native mobile apps.
You can also find premium templates and pre-made applications for each framework, but Angular and React have more premium options available than Vue.
Tested on Razer Blade 15 Advanced (i7- 8750H, 64 GB RAM, Fedora 33 beta (Linux 5.8.13–300, mitigations=off), Chrome 86.0.4240.75 (64-bit)
1 — Duration in milliseconds ± 95% confidence interval (Slowdown = Duration / Fastest)
2 — Startup metrics (lighthouse with mobile simulation)
3 — Memory allocation in MBs ± 95% confidence interval
4 — The smaller the file, the faster the download, and less to parse.
5 — This shows how succinct the given library/framework/language is. How many lines of code do you need to implement almost the same app (some of them have a bit more belts and whistles) accordingly to the specification.
Keep in mind that this is not exactly an apples-to-apples comparison.
Of course, these frameworks, chosen according to their place and time, will get you to the goal, I just tried to explain their differences as much as I could.
We chose React for most web applications as Trendyol after this comparison, the fact that we have a very large community and that already have the know-how were important factors.
Overall I think Angular meets our medium to large-scale needs.
But Angular is not a great framework, major changes make it difficult to switch between versions. The weakness of the community sometimes makes us lose time, you can spend time finding solutions.
Unfortunately, the weak community reduces diversity.
React is a really big community and there are many solutions.
Since it is very popular, there is a very large community and you are likely to find any topic you can think of. With its current versions, it is taking firm steps forward to become a standalone framework by getting rid of its dependencies on other libraries.
Alibaba and Xiaomi use Vue extensively enough to make it popular all over the world, quickly for small to medium application needs.
It has a compact structure that can be developed.
Its weak points are that there are not enough resources and developers, and some important resources are in Chinese.
Pros are that it is a standalone framework, there is a migration tool for version transitions, and it is faster than its competitors.
Thanks for reading.
References and Sources:
Vue 3 Migration Guide | Vue 3 Migration Guide
This guide is primarily for users with prior Vue 2 experience who want to learn about the changes between Vue 2 and Vue…