Separator

Factors to Consider before Selecting a JS web Framework

Separator
Akshat Agarwal, Manager - Technology, Publicis.Sapient Founded in 1990, Publicis.Sapient is the digital business transformation hub of Publicis Groupe, which helps clients drive growth and efficiency and evolve the ways they work.

Evolution of Web
Over the recent years, web development has changed significantly. Driven largely by the rise of mobility, greater bandwidth, powerful and feature rich browsers, the world of development is rapidly changing. Thinking 10 years back, web was a completely different place. Since that time, we have seen the state of web development change drastically.

The Road Ahead
The purpose of this article is to solve this problem by helping you match your current needs and context against the capabilities, strengths and limitations of the most popular JS frameworks available today. We will be limiting our discussion to the top three web frameworks being used today – React, Angular (version 2 and above), Vue.

Explore Ecosystem & Community Popularity
A popular library/framework indicates its stability, performance and how effectively/ efficiently it meets the needs of other organizations. I have tried to capture the popularity of each framework against few of the dimensions like–accumulated GitHub stars and total npm downloads.

The above statistics certainly give us an indication on the quantitative side, but cannot be considered as the real world use. Hence, we will also see some of the real world production application built using these technologies by famous brands.

With all the above statistics, we can conclude that there is no doubt that React is the clear winner in terms of public downloads and adoption.

Corporate Sponsor
Corporate support is another very critical factor that plays an important role in deciding the future, stability and vision of the framework. While Angular has a strong backing from Google team and the same is true for React through Facebook employees, support for Vue has a different model. It is largely backed by a small and medium sized organizations that support the core team.

Deep Dive – Understanding Framework and Its Offering

Pre Requisite Skills& Getting Started Experience
What skills does your team need to have before starting with any of these frameworks,is an important consideration which cannot be ignored. Angular makes heavy use of Typescript which does add a learning overhead for traditional JS developers. React uses JSX and encourages to code in JavaScript(ES6 and onwards). Vue on the other hand is very close to the traditional ways of writing JavaScript, HTML and CSS. It is least disruptive in terms of requiring the use of new languages or technologies.



Angular provides a quick start guide and for more advanced learning refer tutorial, Angular - Tour of Heroes. For getting started with React, you have to choose either from learn by doing or learn concepts first step by step. Starting with Vue can’t be simpler than this. You have an option to just include a single script tag in your HTML. It also provides other ways using CDN and NPM install.

Offering under the Hood
For a complex application, Angular has everything in-the-box, from UI management, to complex state management, routing, end-to-end testing, and more. React, on the other hand, tries to stay UI focused. Vue also offers basic features and we can use Vuex for advanced use cases.

Support for Mobile Development
NativeScript comes with deep integration both with Angular and Vue for native app development while React-Native can be used in react world. Hybrid app development in Angular can be facilitated by Ionic while in Vue, we have options to use Weex (hybrid) or Quasar(hybrid & desktop).

Performance Tooling
Bundling, Tree-shaking and Server-side rendering are supported by all the three frameworks out of the box. In addition to this, angular also has in-built support for AOT and lazy-loading techniques.

Helper Libraries& Tooling Community UI & Component Libraries
Each of the framework are backed by excellent UI & Component libraries. Material design is available – Angular material, Material UI for react and Vue material. Bootstrap is also available for each of these– Bootstrap (Angular), React- Bootstrap, Bootstrap-Vue.

IDE
A smart IDE is as important as to have good coding skills. They both complement each other very well. Visual studio code, VS code or Webstorm are well suited with each of the framework via community extensions. However if your team is more comfortable working with Eclipse or IntelliJ, Angular should be your framework of choice.

Conclusion
I hope it was a fascinating journey where we discussed lot of different aspects and factors to consider while choosing between Angular, React and Vue. While there are some dimensions where each of the framework does well against each other, there are few clear cases where one leads the pack smartly. After reading this article I would hope you are able to clearly mark your boundaries and one of the library clearly stands-out to you. So, while I am not going to call-out a winner, I can definitely suggest that choosing a framework should depend on the given context of your organization, needs of your customer, skills of your development team and scope/timelines of your application. There is no wrong choice between the three, as long as it is informed by the needs of your organization.