Why are some frameworks so popular?
Tags: javascript, webdev, programming, react
Published: 2022-01-01 06:56:02

## Humble Beginnings
I recently checked [Stack Overflow's Developer Survey 2021](https://insights.stackoverflow.com/survey/2021) and instantly saw that
![text on survey page saying React.js surpassed jQuery as the most commonly used web framework](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z8axqvmenzx7lesenlaj.png)

Why is this the case though? How did React become so wide-spread?


![cat saying why gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4wlcu1ph42v5jr9z1jca.gif)

## Clarification
In this case,
```
Most Popular != Most Loved
```

If we take a look back at the popular web framework in the Stack Overflow Developer Survey, we see this bar graph (I think that's what it's called):

![Popular framework graph, Svelte at 2nd to last place and React.js at first place](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/74n1ugv5tg9mi4hksmdu.png)

Now, if we look at the most **loved** frameworks,

![Svelte at first place and React trailing behind at fourth place](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qn5rqws9hejk41pg7v9x.png)

In the first graph, it is evident that Svelte is evidently not that widespread/common compared to other frameworks. However, it seems that Svelte is immensely loved by developers compared to React.

Hence, this is why I'm saying that the Most Popular framework is not the Most Loved. There are hidden gems that don't have the publicity to become widespread, and I believe Svelte is one of these.

## React Study
![React Logo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b9322d197r1npaf62dz9.png)
 

![Big crowd of developers](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rxkeewoyrkcp15nhz34n.jpg)

One thing that I see React has, and **one of the most important factors** for increasing popularity is the size of the community for a technology. With React, if you search up for a fullstack tutorial on YouTube, I can bet that most of the results will definitely include React in them. This is because React has a bunch of developers using it, and so does JQuery.

![Ben Awad Fullstack App Tutorial with React](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a8oy1of2wrsdcmh2j9pp.png)

![FreeCodeCamp Fullstack App Tutorial with React](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/j1f6h8huqjn1zh9838lf.png)

![FreeCodeCamp MERN Stack Tutorial with React](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d6rw5vds7ltvk6i2c8an.png)

![Clever Programmer Fullstack App Tutorial with React](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/98b9eoi3jfimb6spstxr.png)
   
![FreeCodeCamp React & Firebase Fullstack App Tutorial](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sslezs1idqzz1idq6hqj.png)

Now, when someone comes to learn how to create a fullstack application, they will be guided in the direction of React, not the other libraries. I'm going to call this "Filter-Pass-Down" I'm not aware if this is an actual term or not but I made it so it doesn't matter anymore unless one of you comment about it. Then I'll change it. But for now, "Filter-Pass-Down" it is. It only takes a group of developers to be enchanted by the spells of a library before spreading it to others.

![Pile of packages](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/np33axy1osba5tx474yz.png)
 

There is also another inconspicuous reason to why React is so widespread: its ecosystem. There are countless packages designed for React that just make developers' lives that much easier. Things like [Framer Motion](https://www.framer.com/motion/) and [React Reveal](https://www.react-reveal.com/) are mere examples of the vast and massive amounts of packages that help you get work done.

## Svelte

![Svelte Logo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ss05phs5g719l7mf8bdl.png)

One thing that Svelte lacks compared to React is the enormous community surrounding it. Don't get me wrong, it's somewhat there; the problem is that it's small. However, not many professional-grade applications are using it. There are also not that many supporting packages for it like React does. The lack of tutorials to get someone started with development don't use Svelte, so it makes it difficult for large scale adoption to occur. However, I've seen a lot of developers use Svelte and use it afterward, giving me a sense that it will grow in popularity.

## Cherry On The Cake

![Intense big brain power](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hcya8j8e7heem9s6v9rh.png)
 

While the community is one of the most important things to make a framework/library succeed, the **innovative features** it brings are equally important and tie the entire project together in a neat little package.

React used the concept of a Virtual DOM opposed to changing the actual DOM of a webpage, speeding up the entire process of updating the page (it also used declarative state management so you simply had to tell what you wanted to change and it would change the element for you). React also implemented JSX, opposed to the HTML templates stuff the Angular used. All of these features were well liked by the developers who used React, thus promoting the product.

This rise in popularity can also occur for Svelte, I believe. It gives a great user experience and is loved by many developers around the world. Svelte only needs a larger community/ecosystem for it to become a popular tool, and that very well might happen in the future.

Anyways those were my thoughts.

Recap of what you need:
- Massive community/ecosystem
- Innovative Features

People simply need that first taste of your library before suggesting it to others, and it only expands from there.

---

Sorry for the late blog this month I had final exams :(
If you liked this blog though, please leave a comment and click the buttons on the left side of the screen 👍. 

Anyways, I'll try to post faster next month. Happy New Year!

Also, Follow me on Twitter it helps out a ton!: https://twitter.com/ShubhamPatilsd