This article reviews the state of JavaScript frameworks in 2022. We begin with a look at their relative popularity and adoption and provide some key insights behind the statistics. Next, we examine the more technical aspects of each framework including syntax, API, innovations, and commonly used programming languages and software/programming methodologies. Finally, we explore the future of the frameworks and what trends and pushback we are seeing in their adoption.
There are numerous sources for insight into the popularity and adoption of JavaScript frameworks including Stack Overflow's Annual Developer Survey, download trends on npm (the JavaScript package repository), Thoughtworks Technology Radar, and the State of JavaScript Survey. Let's walk through each.
The Stack Overflow Annual Developer Survey is the most reliable source of information as it has the over 80,000 developers completing it each year from diverse technical backgrounds. The most relevant parts of the survey are the Web Frameworks sections, in particular the Most popular technologies, as well as the Most loved/dreaded, and wanted frameworks.
In 2021, React.js surpassed jQuery as the most used web framework and Angular and Vue.js continue to increase adoption.
Newcomer Svelte takes the top spot as the most loved framework. The blue is loved. The purple is dreaded.
React is the most wanted, desired by one in four developers. Vue.js is also appealing to many developers.
Each data point on this chart represents the number of weekly downloads for each of these frameworks.
What surprises most people is the large lead React has over the other two major JavaScript frameworks. To better understand why this is the case, it is important to realize that not all the frameworks have the same number of use cases (jobs). React is not only compelling for creating web applications, but also websites and native mobile applications for iOS and Android (with React Native). This effectively gives React three full-time jobs to Angular's one (web applications). Vue.js has two jobs (web applications and web sites).
Also, it is important to point out that both Angular and Vue.js are newer and their adoption is still growing rapidly with double the downloads of two years ago. Each framework is downloaded nearly 3 million times a week. In summary, Angular and Vue.js are still excellent framework choices.
One last thing to consider is that in my experience, Angular is used considerably more in large companies. These companies often have an internally hosted npm repository for security reasons where developers can download only approved libraries instead of getting the open-source code externally from npm. This can easily mean one download should have counted as 10,000 downloads (some companies employ a lot of developers!), so I believe the numbers get skewed.
The State of JavaScript survey is another excellent industry survey to help us find which libraries developers want to learn next, which have the best satisfaction ratings, and much more. The latest results were from the year 2020 at the time this article was written. The story these numbers tell is largely the same as the Stack Overflow Annual Developer Survey. To summarize: There are three clear leaders: React, Angular, and Vue.js. The best way to see this is to visit the site and click on usage. The other framework to keep an eye on is Svelte, which I talk about more in the last section of this article. Svelte now has a slight lead over React in terms of satisfaction and interest.
The Technology Radar from Thoughtworks is more opinionated, granular, and cutting edge in its evaluation of technologies and is great to look at as well. They are giving an Adopt recommendation for React Hooks (they feel strongly that the industry should be adopting these items) and a Trial recommendation for React Query. These are both interesting technologies that Accelebrate's customizable React training can include. In summary, even if your team has been using React for a while, consider an updated training on using React Hooks and React Query to modernize your React skills.
JavaScript frameworks are more similar than they are different. After all, they are doing the same thing: making it easier to create a web application in JavaScript. A great way to see this is to watch this YouTube video that builds the same application in each of the frameworks in 10 minutes. The video goes on to show the same application being built with 6 other frameworks that aren't as common, but you can get the idea in the first 10 minutes and see all the syntax differences, which I will elaborate on momentarily.
The YouTube channel that created the above video, Fireship.io, is an amazing resource for keeping up on new technology. They commonly present 100-second videos on new technologies and don't waste your time. Here are four 100-second videos on React, Angular, Vue, and Svelte to convince you:
After watching a few of the videos, you quickly see how these frameworks differ from one another. Let me highlight some of these technical differences, particularly in the syntax and APIs:
Angular, React, and Vue are the current popular choices for a JavaScript framework. What about in the future? Looking into my crystal ball (which has admittedly not been 100% accurate in the past), I think the most likely to succeed framework (after it graduates from high school!) is Svelte.
Svelte has innovated in several significant ways including having less code, being a compiler and not a framework (resulting in the framework disappearing when built for production, and lastly being truly reactive.
Even in the simplest example, Svelte is 9 lines of code compared to 21 lines of code in React and 18 lines of code in Vue. This difference becomes significant over even a medium-sized code base.
Whereas traditional frameworks like React and Vue do the bulk of their work in the browser, Svelte shifts that work into a compile step that happens when you build your app. Instead of using techniques like virtual DOM diffing, Svelte writes code that surgically updates the DOM when the state of your app changes.
Instead of complex state management APIs (React Hooks) or libraries (Redux), Svelte builds reactivity into the DOM itself, which is innovative and results in less code, easier to understand code, and faster code.
This article has summarized JavaScript Frameworks as we enter 2022, including numerous resources that you can use to evaluate them for your development needs. In addition, I have summarized and analyzed these resources and provided some insights about JavaScript Frameworks that you may not have considered yet as you evaluate your future technology roadmap.
Accelebrate offers customizable JavaScript training courses in all the technologies mentioned in this article and they are listed below for your convenience. Most notably our React curriculum stays current using the TypeScript language (if requested), uses React Hooks instead of class components, and provide forward-thinking alternatives to Redux including React Query. And we offer Angular, Vue.js, and Svelte courses as well.
Written by Craig McKeachie
Our live, instructor-led lectures are far more effective than pre-recorded classes
If your team is not 100% satisfied with your training, we do what's necessary to make it right
Whether you are at home or in the office, we make learning interactive and engaging
We accept check, ACH/EFT, major credit cards, and most purchase orders
Alabama
Birmingham
Huntsville
Montgomery
Alaska
Anchorage
Arizona
Phoenix
Tucson
Arkansas
Fayetteville
Little Rock
California
Los Angeles
Oakland
Orange County
Sacramento
San Diego
San Francisco
San Jose
Colorado
Boulder
Colorado Springs
Denver
Connecticut
Hartford
DC
Washington
Florida
Fort Lauderdale
Jacksonville
Miami
Orlando
Tampa
Georgia
Atlanta
Augusta
Savannah
Hawaii
Honolulu
Idaho
Boise
Illinois
Chicago
Indiana
Indianapolis
Iowa
Cedar Rapids
Des Moines
Kansas
Wichita
Kentucky
Lexington
Louisville
Louisiana
New Orleans
Maine
Portland
Maryland
Annapolis
Baltimore
Frederick
Hagerstown
Massachusetts
Boston
Cambridge
Springfield
Michigan
Ann Arbor
Detroit
Grand Rapids
Minnesota
Minneapolis
Saint Paul
Mississippi
Jackson
Missouri
Kansas City
St. Louis
Nebraska
Lincoln
Omaha
Nevada
Las Vegas
Reno
New Jersey
Princeton
New Mexico
Albuquerque
New York
Albany
Buffalo
New York City
White Plains
North Carolina
Charlotte
Durham
Raleigh
Ohio
Akron
Canton
Cincinnati
Cleveland
Columbus
Dayton
Oklahoma
Oklahoma City
Tulsa
Oregon
Portland
Pennsylvania
Philadelphia
Pittsburgh
Rhode Island
Providence
South Carolina
Charleston
Columbia
Greenville
Tennessee
Knoxville
Memphis
Nashville
Texas
Austin
Dallas
El Paso
Houston
San Antonio
Utah
Salt Lake City
Virginia
Alexandria
Arlington
Norfolk
Richmond
Washington
Seattle
Tacoma
West Virginia
Charleston
Wisconsin
Madison
Milwaukee
Alberta
Calgary
Edmonton
British Columbia
Vancouver
Manitoba
Winnipeg
Nova Scotia
Halifax
Ontario
Ottawa
Toronto
Quebec
Montreal
Puerto Rico
San Juan