For almost a decade speed is becoming a more and more important factor for providing a good user experience. Because of this we are experiencing a massive growth in modern web and mobile applications, powered by lightweight and sophisticated JavaScript libraries. One of the most popular libraries to use for these kinds of applications is React.

Facebook developed React in 2011 and open-sourced it in May 2013. React is a mature and stable technology with already over eight years worth of features and improvements built-in. It has gathered over 134.000 stars and is used in over 2.3 million (!) projects on Github.

Of course React is also used by enterprise companies, take these for example: Airbnb, Instagram, The New York Times, WhatsApp Web, Adobe and Twitter. Therefore it is pretty safe to say that Reacts popularity is not just based on a hype.

A brief introduction

Before getting into why React is so popular it might be a good idea to first explain what React actually is. Reacts website describes React as ‘A JavaScript library for building user interfaces’. This basically means that you can use React to build the view layer of your application.

The view layer is the part of the application that actually shows stuff on the screen, everything that is visible to the user of your application is part of the view layer. You could also describe this as the front-end or user interface of your application.

React does not handle the back-end of your application so you could use your favourite choice of technology for that. Basically any type of back-end plays nice with React as long as there is an API to communicate with. React does not force you to do things a certain way and this is one of the unique selling points for React. React is very flexible which means you can achieve the same result in multiple ways.

Why use React?

It is a fact that React is not the best solution for any type of project. If your application is just a simple website without any dynamic content or other fancy functionality using React (or any other JavaScript library for that matter) will probably be overkill. However, if you need to develop an application which is serving up a lot of dynamic content or needs (a lot of) client-side functionality then using React is a good choice.

React really shines when it comes to updating small parts of an application as React implements something called the virtual DOM. Before explaining the virtual DOM (Document Object Model) let us first talk about the ‘normal’ DOM. The DOM in simple words represents the user interface (UI) of your application. Every time there is a change in the state of your UI, the DOM updates to represent that change. The problem with this is that when the DOM is frequently manipulated the performance is negatively affected. This will make your application feel slow and sluggish.

This is where the virtual DOM comes around the corner. The virtual DOM is just a virtual representation of the DOM so it is less taxing to manipulate. When there is a change in the state of your UI, React only updates the virtual DOM instead of the normal DOM. Once the virtual DOM has been updated React compares the current version of the virtual DOM to the previous version. This is called ‘diffing’.

Once React knows which virtual DOM objects have been changed React updates only those objects in the real DOM. This performs way better when compared to manipulating the DOM directly so this is one of the main reasons why React is so fast.

There are other reasons than performance to consider using React for your next project. React is component based and writing a React component is not that hard. Component based development is an important part of any code base which values structure and scalability. React is really good in facilitating component driven development so using it makes it easier to properly structure and scale your project.

Another possible reason for choosing React as your library of choice is the community behind it. As mentioned earlier, React is build and maintained by Facebook so you do not have to worry about suddenly having a non-maintained library since Facebook is not going out of business any time soon.

Besides being backed by Facebook, React is also really popular among developers in general. This leads to a wide variety of tools and plugins specifically built for use in React projects. There is even a browser extension known as ‘React Developer Tools’ for Chrome and Firefox which helps you inspect and debug React applications.

Another well known tool related to React is Create React App. Create React App is a command-line interface (CLI) which can be used to generate a React application with only one command. You do not need to configure anything, you can just start coding right away. Create React App is especially handy if you want to quickly prototype something without wanting to worry about configuring an entire project.

Also, if you ever post a question about React on a website like StackOverflow you will probably get a lot of responses quickly. Knowing this positively affects your peace of mind and it also lowers the barrier for new developers who want to get started with React.

But what about mobile?

Do not fear as Facebook open-sourced React Native in March 2015. React Native gives developers the opportunity to write and use React code in their native applications. This React code will communicate with native functionality using what is called a ‘bridge’.

In theory you could write an entire native application with React Native. However, this is not recommended since, in some cases, using React Native code instead of native code leads to performance issues. So in most project teams a React Native developer works closely together with a native developer so they can achieve the best performing result together.

React Native is not as popular as React itself but React Native still managed to collect an impressive 80.000 stars and is used in over 260.000 projects on Github. Another nice thing about React Native is that most tools from the React ecosystem are also compatible with React Native!

However, because of the growing possibilities modern browsers offer regarding the usage of native functionality it is not always necessary to go with a native application. Currently almost all native functionality can already be accessed in a progressive web application (PWA) which just runs in the browser. It is just a matter of time before a PWA will have access to all native functionality giving us the opportunity to develop native feeling PWA’s. I would not be surprised if in the (near) future almost all native applications will get replaced by PWA’s.

Conclusion

It does not look like the growth of React or JavaScript in general is slowing down any time soon. If you are planning to build a new application in the (near) future it is a good idea to spend some time investigating React and other similar JavaScript libraries.

Want to learn more about React? Go check out their official website, take a look at Dan Abramov's (a ‘famous’ developer who works on React and Redux) blog.