So, what is the situation in the frontend garden in 2020?
We analyzed the number of open positions worldwide that require a specific knowledge of a certain framework. As a source, we took Indeed.com and got the following distribution according to more than 60,000 job offers.
Taking into account the following data, we decided to share the main advantages and disadvantages of every frontend framework and help tech professionals or engineers to choose the best one for their development needs.
Pros and cons of Angular
Benefits of Angular:
- Angular?s created to be used alongside with Typescript. And has exceptional support for it.
- Angular-language-service ? which allows intelligence and autocomplete inside of component external HTML template files.
- New features like a generation of Angular based npm libraries from CLI, generation, and development of WebComponents based on Angular.
- Detailed documentation that allows getting the all necessary information for the individual developer without asking his colleagues. However, this requires more time for education.
- One-way data binding that enables singular behaviour for the app which minimized risks of possible errors.
- MVVM (Model-View-ViewModel) that allows developers to work separately on the same app section using the same set of data.
- Dependency injection of the features related to the components with modules and modularity in general.
- Structure and architecture specifically created for great project scalability
Drawbacks of Angular:
- Variety of different structures(Injectables, Components, Pipes, Modules etc.) makes it a bit harder to learn in comparison with React and Vue.js, which have an only ?Component? in mind.
- Relatively slower performance, according to different benchmarks. On the other hand, it can be easily tackled by utilizing so-called ?ChangeDetectionStrategy?, which helps to control the rendering process of components manually.
Companies that use Angular: Companies that use Angular: Microsoft, Autodesk, MacDonald?s, UPS, Cisco Solution Partner Program, AT&T, Apple, Adobe, GoPro, ProtonMail, Clarity Design System, Upwork, Freelancer, Udemy, YouTube, Paypal, Nike, Google, Telegram, Weather, iStockphoto, AWS, Crunchbase.
Pros and cons of React
Benefits of React:
- Easy to learn, thanks to its simple design, use of JSX (an HTML-like syntax) for templating, and highly detailed documentation.
- Extremely fast, courtesy of React?s Virtual DOM implementation and various rendering optimizations.
- Great support for server-side rendering, making it a powerful framework for content-focused applications.
- First-class Progressive Web App (PWA) support, thanks to the `create-react-app` application generator.
- Data-binding is one-way, meaning less unwanted side effects.
- Redux, the most popular framework for managing application state in React, is easy to learn and master.
- React implements Functional Programming (FP) concepts, creating easy-to-test and highly reusable code.
- Applications can be made type-safe with either Microsoft?s TypeScript or Facebook?s Flow, with both featuring native support for JSX.
- Migrating between versions is generally very easy, with Facebook providing ?codemods? to automate much of the process.
- Skills learned in React can be applied (often directly) to React Native development.
Drawbacks of React:
- React is unopinionated and leaves developers to make choices about the best way to develop. This can be tackled by strong project leadership and good processes.
- The community is divided on the best way to write CSS in React, split between traditional stylesheets (CSS Modules) and CSS-in-JS (i.e. Emotion and Styled Components).
- React is moving away from class-based components, which may be a barrier for developers more comfortable with Object Oriented Programming (OOP).
- Mixing templating with logic (JSX) can be confusing for some developers at first.
Companies that use React: Facebook, Instagram, Netflix, New York Times, Yahoo, Khan Academy, Whatsapp, Codecademy, Dropbox, Airbnb, Asana, Atlassian, Intercom, Microsoft, Slack, Storybook, and many more.
Pros and cons of Vue.js
Benefits of Vue.js:
- Empowered HTML. This means that Vue.js has many similar characteristics with Angular and this can help to optimize HTML blocks handling with the use of different components.
- Adaptability. It provides a rapid switching period from other frameworks to Vue.js because of the similarity with Angular and React in terms of design and architecture.
- Awesome integration. Vue.js can be used for both building single-page applications and more difficult web interfaces of apps. The main thing is that smaller interactive parts can be easily integrated into the existing infrastructure with no negative effect on the entire system.
- Large scaling. Vue.js can help to develop pretty large reusable templates that can be made with no extra time allocated for that according to its simple structure.
- Tiny size. Vue.js can weight around 20KB keeping its speed and flexibility that allows reaching much better performance in comparison to other frameworks.
Drawbacks of Vue.js:
- Lack of resources. Vue.js still has a pretty small market share in comparison with React or Angular, which means that knowledge sharing in this framework is still in the beginning phase.
- Risk of over flexibility. Sometimes, Vue.js might have issues while integrating into huge projects and there is still no experience with possible solutions, but they will definitely come soon.
Companies that use Vue.js: Xiaomi, Alibaba, WizzAir, EuroNews, Grammarly, Gitlab and Laracasts, Adobe, Behance, Codeship, Reuters.
For a real engineer, there is no substantial difference in which framework to choose, because it just takes some time to get used to the new one. In our company, we grow expertise in mostly React and Angular, but Vue.js is also on board. Every framework has its own pros and cons, meaning that there should be just the right choice for every single case during product development.