The official website of Grape City, grape city for developers to provide professional development tools, solutions and services, enabling developers.
www.sitepoint.com/most-popula…
In recent years, there have been so many frameworks in front-end development that it’s hard to choose from them. Today we’ll compare the five most popular front-end JavaScript frameworks and give you an overview of their key features, tools, learning curves, and other factors to help you measure and choose.
Popularity measure
The prevalence of frameworks is determined by framework usage according to the 2020 JavaScript Survey. The survey was completed by 23,765 respondents with the following results:
React: 80% Angular: 56% vue.js: 49% Svelte: 15% PreACT: 13%
React: 100% Angular: 100% vue.js: 99% Ember: 88% Svelte: 86% Front-end framework definition
For the purposes of this article, the text will use the definition provided by Martin Fowler:
Libraries are essentially a set of functions that developers can call, usually organized into classes. The call does some work and returns control to the client.
The framework represents abstract design, with more behavior built in, which developers use at different points in the framework by subclassing or inserting their own classes, and the framework calls the code at those points.
- React
Released by Facebook in 2013, today’s most popular front-end framework. For Facebook, Netflix, Airbnb and other company products, has a large number of developers and rich learning resources to use.
There are a number of React related tools. The team provides the CLI for setting up a new project easily, and tool extensions for Chrome and Firefox. Contains a number of third-party packages for a variety of tasks (e.g., routing, handling forms, and animation), as well as several React based frameworks such as next.js and Gatsby.
React follows the “Learn once, write anywhere” philosophy. It uses React Native to power mobile applications, uses Node to render on servers, and has excellent SEO support.
The prevailing wisdom was that React was too simple: it was all about the view layer of the application, which was left to the developers, and there were mixed opinions about the high degree of freedom.
If you learn, the learning curve is moderate. React encourages developers to use a variety of functional programming paradigms (such as immutability and pure functions) that require a basic understanding of basic concepts before building
Overall, if you’re happy with react’s freedom, it’s a good choice for data-driven applications of any size.
- Angular
As a Google front-box offering, it was born as AngularJS (or Angular 1) in 2010 and became an immediate hit, mainly because developers were able to build the first frameworks for what are now called single-page applications.
To address performance issues and the challenges of building large JavaScript applications, Google rewrote AngularJS and released Angular 2 (now just Angular) in 2016. AngularJS and Angular are two separate frameworks because they cannot be easily migrated.
Angular plays an important role in the front-end framework, having been rigorously tested and put into production by companies such as Google and Microsoft, and has extensive online resources.
Unlike React, which deals only with the view layer, Angular provides a complete solution for building single-page client applications. Angular components implement two-way data binding to listen for events and update values between parent and child components simultaneously. Templates are part of HTML that allow special syntax to take advantage of many Angular features. TypeScript is the primary language for Angular development, so the framework is ideal for enterprises and applications.
In terms of Tools, Angular provides a highly sophisticated CLI for initializing, developing, building, and maintaining its applications, as well as Chrome and Firefox Dev Tools extensions for debugging Angular applications.
But in terms of learning, Angulard has the steepest learning curve. Developers need to be familiar with TypeScript to work, which is not the best choice for beginners and is more suited to working on a team.
- Vue.js
Note: Statistics apply to Vue V2, version 3 is available and must be installed at vue@next.
Vue is a model-view-View model (MVVM) front-end framework for building user interfaces and single-page applications. Written by Evan You and first published in 2014.
Vue is now being manufactured by companies such as Alibaba, Gitlab and Adobe. Arguably the best documentation of all frameworks, its forum is an excellent resource for help with coding problems. Vue is popular in the PHP world and is part of the Laravel framework.
The core selling point of Vue is that it is designed from the ground up and can be adopted gradually, that is, Vue can enhance common web features or build components to improve single-page applications, while Anugular can provide a single file component based on HTML and bind properties to the underlying data model.
In terms of the completeness of the tools, the official CLI can create scaffolding and develop Vue applications, while the DevTools extension is available for Chrome and Firefox to help with debugging. Unlike React, Vue provides an official package for routing and state management, a convenient and standardized processing method, and various third-party tools and VUe-based frameworks.
But the barrier to entry is low compared to other frameworks and is suitable for inexperienced developers.
- Svelte
Published by Rich Harris in 2016, as a new member of the front-end framework, it takes a different approach to building Web applications than other frameworks.
It eschews the concept of a virtual DOM and compiles code during build into a small raw JavaScript module that updates the DOM as the developer’s application state changes. The application of small volume and fast speed is realized.
Rich Harris has a low learning curve and a small community, but it has been used in production by companies like IBM and The New York Times and has potential for the future.
Due to its low maturity, it is only preferred for small projects, but the situation is gradually changing. SvelteKit is in public beta and the community is growing. Although Svelte is young, developers should take note.
- Ember.js
And finally Ember, which has been around since the beginning of front-end frameworks. Originally released in 2011, but still popular in the development world:
Its history goes back to before React, Vue, Svelte and all the others. The framework has never been at the forefront of the front end hype, but continues to forge ahead. Partners include Qonto and CLARK, two of the top 50 Fintech companies in Europe in 2020.
Like Angular, Ember takes a more battery-inclusive approach to application development and provides everything you need to build modern front-end JavaScript applications. It follows a six-week release cycle and is extremely stable.
In terms of tools, there are many, from the Ember CLI to the Ember Inspector, and many third-party libraries available.
Its community is no bigger than other popular frameworks, but its members are highly engaged, and it has forums and a Discord server that makes it easy to ask for help with coding problems.
With a medium to steep learning curve for developers, Ember may not be the best choice for beginners or smaller projects. It has a lot of moving parts and doesn’t offer much flexibility in organizing things as part of a team’s work.
conclusion
This article compares five of the most popular front-end frameworks on the market today to provide a better reference for developers to make choices based on individual capabilities and project requirements.
Read more: If you’re struggling to make a choice among the many front-end technologies, try spreadjs and other cross-frame control table technologies that aren’t limited by the content of the framework.