Jagroop Singh

Posted on Dec 23, 2022

Why React.js is So Popular ?

#react #javascript #webdev #beginners

React is a popular JavaScript library for building user interfaces. It was developed by Facebook(Meta) and is often used for building single-page applications and mobile applications.

There are several reasons why React has become so popular:

Reusable components: React allows developers to create reusable components that can be used throughout an application. This makes it easier to build and maintain complex applications.

Virtual DOM: React uses a virtual DOM (Document Object Model) to improve performance by limiting the number of DOM manipulation operations required to update the view.

One-way data flow: React follows a unidirectional data flow model, which helps to prevent common issues such as cascading updates and makes it easier to reason about the state of an application.

Strong community: React has a strong and active community of developers who contribute to the development of the library and create third-party libraries and tools that can be used with React.
JSX: React uses JSX, which is a syntax extension for JavaScript that allows developers to write HTML-like code in their JavaScript files. This can make it easier to build and understand the structure of a React application.

Compatibility with other libraries: React can be used with a variety of other libraries and frameworks, making it a flexible choice for building web and mobile applications.

Popularity of JavaScript: React is built with JavaScript, which is a widely-used programming language, making it easier for developers who are familiar with JavaScript to learn and use React.

Performance: React's virtual DOM and one-way data flow model help to improve the performance of applications by minimizing the number of DOM manipulation operations required to update the view.

SEO-friendly: React applications can be made SEO-friendly by rendering the initial HTML on the server and then handling dynamic updates on the client side.

Large ecosystem: There is a large ecosystem of tools, libraries, and resources available for React, which makes it easier for developers to find solutions to common problems and to build and deploy applications.

Easy to learn: React has a small API and a straightforward syntax, which makes it relatively easy for developers to learn and use.

Strong documentation: React has comprehensive documentation that provides clear and detailed information about how to use the library and its various features.

Wide adoption: React is used by many large companies and organizations, which can help to build confidence in its stability and reliability.

Regular updates: React is actively maintained and developed by Facebook, and new versions and updates are released regularly, which helps to keep the library up-to-date and in line with modern best practices.

Versatility: React can be used to build a wide variety of applications, including web, mobile, and desktop applications, which makes it a versatile choice for developers.

Overall, React's combination of above points make it a popular choice for building modern web and mobile applications.

Top comments (26)

John Peters • Dec 23 '22

All true, but there is one omission. React is opinionated. Pure Javascript or TypeScript are not.

Now that WASM is here Javascript is not the only player any longer. For some, that's wonderful news.

Ivan Jeremic • Dec 25 '22

If react is opinionated for you I highly doubt you ever used it or are you even a developer who knows how to code?

Jagroop Singh • Dec 26 '22

Truely said.

John Peters • Dec 26 '22

I suffered once from Angular astigmatism once. I thought it was everything. I stuck to my guns for a long time, not because it was better, but because it's what I knew. Have you studied HTML5 Web Components?

John Peters • Dec 26 '22

I've probably been coding longer than you've been alive. But just like your comment is opinionated, so is React. The only non opinionated work going on today is HTML5 Web Components. Also, at only 12 posts to this forum I don't recognize any prolific contribution either.

Rense Bakker • Dec 24 '22 • Edited

Explain how React is opinionated compared to say... Angular or Vue... React is actually written in pure js or ts. The only thing thats not vanilla is jsx and even that tries to stay extremely close to what you expect from vanilla HTML and js. Infact not being opinionated is often cited as one of the biggest pitfalls for React. In React you can do things "the wrong way" very easily and it will still work.

John Peters • Dec 26 '22

Angular is the worst, next is Vue, then React. All of these "frameworks" compared to HTML5 Web Components are the long way to "get there"

Rense Bakker • Dec 27 '22

🤔 tbh I don't have enough experience with web components to disagree, but it seems to me some of these frameworks are pretty popular with high satisfaction ratings as well if you look at state of JS survey from 2022. So they can't all be bad.

John Peters • Dec 27 '22

Rense;
I never mentioned anything regarding popularity or satisfaction, I only mentioned the word "Opinionated".

The Web Component architecture is as "close to the metal" as possible, because the browser(s) have all exposed Web Component interfaces. When we code we are not coding to React (if we don't want to) we code directly to the Web Browser interface instead using plane old Javascript.

In addition, with the advent of WASM other languages such as C#, Python, and even Rust can replace Javascript completely.

Here's a Javascript Custom Web Component article.

Rense Bakker • Dec 28 '22

I mentioned popularity and satisfaction. The whole reason these frameworks were developed in the first place was to enable devs to build web applications faster. Specifically managing the DOM manipulation thats required to build big enterprise applications with a lot of user interaction. Web components do not solve this problem... You cannot really compare them at all tbh. Compared to other frameworks, React is not opinionated and is much closer to vanilla JS/TS.

John Peters • Dec 28 '22

Everyone has their own opinions. One question; how is this code not opinionated? Of course it's JSX which is a React only thing. But there's no such method as render in the DOM, this is a React API function.

class HelloMessage extends React.Component {
  render() {
    return <div>Hello {this.props.name}</div>;
  }
}

root.render(<HelloMessage name="Taylor" />);

Or this, the built-in Props and state machine.

class Timer extends React.Component {
  constructor(props) {
    super(props);
    this.state = { seconds: 0 };
  }

  tick() {
    this.setState(state => ({
      seconds: state.seconds + 1
    }));
  }

  componentDidMount() {
    this.interval = setInterval(() => this.tick(), 1000);
  }

Don't forget Hooks

And it's Styling

It's not opinionated to you because you bought into the React way. It's your primary coding framework.

Web Components interface directly to the DOM and the DOM provided Web Component interface. No middle man framework needed. To say Web Components cannot do what react does is just not true.

Rense Bakker • Dec 28 '22

Again... web components is not a framework.

The code you show is really old class-based React code.

React hooks are plain javascript functions.

JSX is an extension of JS. Its less opinionated than the custom commenting style for loops/conditional rendering that frameworks like svelte use, or the custom html elements/attributes style that angular/vue use. With React you write more actual compliant JS code, compared to any of the other frameworks.

Rense Bakker • Dec 28 '22

Good luck writing an enterprise web application with just web components I guess.

John Peters • Dec 28 '22 • Edited

I never said Web Components is a framework. The code I showed is on their main page describing react. Hooks is not a Javascript concept it's a React concept. The rest of the points above are irrelevant to my original post. I know, you love React, that's ok.

Rense Bakker • Dec 29 '22

... You come to a post about React and start making weird comparisons with web components...

Im glad we agree web components is not a framework. So this whole discussion was pretty much pointless, because you are talking about how opinionated a framework is compared to something thats not a framework... Its a useless comparisson.

Hooks are not a React concept: en.wikipedia.org/wiki/Hooking
But that was not even my point. My point was that React hooks use standard javascript code. They are valid javascript callbacks in every way shape and form.

You cannot have a framework without some form of an API, the level to which that API forces you to use non standard (vanilla) concepts is what is referred to as opinionated.

Appearantly even web components have lifecycle callbacks: developer.mozilla.org/en-US/docs/W...
which makes it pretty similar to old class-based React... The difference being that web components do not offer a way to manage state without constantly rerendering everything, unless you write your own custom diffing logic... Which is why people use frameworks like React... But again, thats not what web components are meant to do. Web components is purely for creating reusable components. Not for building enterprise web applications, which is what frameworks are for.

John Peters • Dec 29 '22

I started by stating that React is opinionated and I still believe that to be true. The word "framework" needs to be defined because you stated

WebComponents are not a framework

then you said

You cannot have a framework without some form of an API

The entire Browser is a massive API. So I think you are confusing.

As far as hooks, the term hook or hooks has been known to programmers for 50 years. But React has an opinionated way of implementing them. Just look at the api on it. It takes people days to get the concepts.

The same goes with React States. Programmers have been using state logic for over 50 years. React comes along and says "This is how it's done". That's an opinion and another week to learn their way.

Anything React does can and will be done using Web Components. Including using WASM which will be a huge security benefit to the Enterprise.

Anyway I agree this discussion is worthless, you are a React only person and I'm selling Web Component goodness. Guess I made the wrong stop.

Rense Bakker • Dec 30 '22

You're full of assumptions, that's for sure. I'm not a React only person. Maybe you're projecting that you're a web components only person?

John Peters • Dec 30 '22

Fair enough, you are a React defender.

eshimischi • Dec 23 '22 • Edited

the only thing is true is “strong dev community”, other things are pretty the same for all other libraries/frameworks, they are all based on the same Javascript.. so your list of “benefits” are very much arguable.. yes as someone said above, performance of React is low..

Rick Delpo • Dec 24 '22

React may be popular but I prefer plain javascript because I think it loads faster and there is much less overhead. I wrote a dev article comparing React to Plain JS.
click here to read it.... dev.to/rickdelpo1/react-vs-plain-j...

Jagroop Singh • Dec 25 '22

Interesting !!

Jon Randy 🎖️ • Dec 23 '22

Interestingly, React's performance generally comes out near bottom in comparisons/benchmarks of popular front end libs/frameworks

Alex Lohr • Dec 23 '22

Explaining the popularity of react with its popularity and wide adoption is a tautology.

Also, it has been demonstrated that a vDOM is pure overhead and you have to opt out of reconciliation using memoization to remain performant.

React cannot even use web components without a wrapper, so the point of the compatibility is patently wrong, too.

The current documentation is a mess. The beta docs are really good, though. Kent C. Dodds' stuff is also great, but that counts as community rather than react's own documentation being good.

Most of your points are either fallacious or wrong. But react isn't even really bad, it's more or less mediocre, in a dependable kind of way. But that dependable mediocrity is what gets CTOs' trust.