React.js: why choose it for your startup in 2020?

Marcin Wojtczak
18 June 2020

For the past ten years, the front-end ecosystem has been changing rapidly. It has brought a lot of improvements to the tooling and the overall developer experience. However, the number of tools available and the ever-changing best practices led to "Front-End Fatigue." After a fast cycle of innovations, three major players are left in the field of development tools, and React.js is the king of all.

The top three front-end frameworks

Angular

Back in 2012-2015, Angular.js (a JS framework made by Google) was the king of the front-end frameworks. Unfortunately, it wasn't scaling well enough for the modern era SPA application requirements. The core team decided to rewrite the entire project from scratch. The name also changed from Angularjs (1.x versions) to Angular 2 for the newest releases, and later became merely “Angular." 

Long story short, this transition didn't come out well for the framework. Many people left it and chose to use other solutions like React or Vue. Does it mean that the Angular is a wrong choice? Not at all. However, it is now mostly used by big companies that have time and money to invest in it due to the shortage of developers and the learning curve required.

React

Facebook released the first version in 2013. At that time, it didn't get significant usage because of some innovative solutions developers had to adjust to. Afterward, tools and best practices changed almost every month, resulting in the fatigue mentioned above. However, it generated smart solutions to existing problems and means that React now has a vast ecosystem of tools suited for almost any use-case. For the past 2-3 years, third-party libraries and React itself have matured and have overthrown Angular.js as the most popular solution.

Vue

Initially released in 2014, Vue benefited from the start from an excellent appraisal among front-end developers. It is also the only framework in the top 3 ones that a big company didn't create. Many programmers describe it as a collection of the best parts of React and Angular. Rightly so. 

You might think it’d give Vue the biggest market share. Not at all. Many companies don't want to use it because a big corporation does not back it. As a result, there are fewer articles, books, and tools made for this ecosystem, which makes work more complicated. Organizations like Gitlab use it. But in Europe and the US, it lags behind React and Angular.

Why choose React.js?

As mentioned earlier, React has become the most popular solution, especially among small to mid-sized companies. Let's review its strengths and weaknesses.

React's strengths

  • A vast ecosystem of libraries, additional tools, tutorials, and articles. You can choose from many good solutions to solve everyday problems. Companies can focus on areas that are specific to their use-cases. Besides, developers can be productive in a short time, and get help from a vast online community.

  • Some fantastic developer tools available for almost all major browsers to inspect an application, component by component. Apart from the ability to change the components’ state as you go, you can also do a performance check and analysis.

  • A UI library in which you can write code mostly in JavaScript. It focuses on being REALLY astounding at what it does best and lets the open-source community concentrate on solving other issues. Any developer who knows JavaScript can produce code quickly.

  • An architecture for programmers to create an application made mostly from components. Each component can handle its logic, rendering, and styling. It makes the creation of reusable components a breeze. Apps are easier to develop and maintain.

  • Great performance thanks to the usage of so-called Virtual DOM. Without it, the user interface might slow down significantly when frequently updating the application data or doing a lot of user interactions. Virtual DOM solves this by creating an in-memory representation of the actual DOM structure, detecting the parts that need to change, and performing updates only on those nodes. Thanks to this and some other performance tweaks, it is quite hard to make a slow application.

React's weaknesses

  • React is focused on being a UI library. You have to choose the additional tools to handle routing, state management, styling, forms, etc. It may be a problem, especially for junior developers who need to learn new libraries for every project. While useful for their development, it makes it tricky to deliver value from day one.

  • JSX syntax is not as readable as "normal" HTML templates. It is not a massive issue since everyone can adapt, and code editors' support is great. However, if someone doesn't know JavaScript and wants to apply styling to a template created in JSX, it may be tricky for that person to understand what's going on.

  • The React ecosystem is not opinionated. You can expect different code styling, folder, or structure for almost every project. That’s why it’s worth creating a company-wide boilerplate project with a style guide. It will probably help to solve those issues since there is an agreed blueprint, which can be used for all new projects.

What is React.js used for?

Single Page Application

It is the most popular usage. The entire front-end is downloaded from the static server as js files to be interpreted by a browser to create an HTML structure. The entire application is just a single HTML page, and a JavaScript handles everything else (like routing). The most common tools used for creating a SPA are: Create React App, React Router and Redux. To handle a server-side rendering, you can use Next.js, a more advanced framework built on top of React.

Native Application

Creating a native mobile application has always been challenging. Developers have to write two separate code bases for iOS and Android. At first, people solved the issue by writing a JS application and displaying it in a platform web view. But performance issues and a lack of access to native functionality made it problematic. The solution came from React Native. Developers write React components in JavaScript and have them compiled into the native code. Problems solved!

Static Website

Up until recently, this type of website was handled mainly by a server-rendered HTML, with the king being Wordpress. Recent developments in the JavaScript world led to the creation of tools like Gatsby.js, which allows developers to write templates as components and populate them with content from either markdown files or some headless CMS solution.

In a nutshell

Thanks to React’s popularity and its mature ecosystem, developers have tools to create lots of projects using a single library. Transitioning from developing a single page application to a native app isn’t painless, though. Every domain has knowledge requirements related only to the used tools. However, a single library and language for all the different domains make switching much easier.

Are you looking for a React development team? We’re just an email away. Drop us a line at hello@start-up.house

You may also like...

Development

What almost a decade of development in Ruby on Rails taught me about quick prototyping

Millions of mobile and web applications are created every year, with only a small percentage of them ultimately succeeding. Quick prototyping is more crucial than ever, not only for creating new...

Adrian Nowak
01 July 2020
Development

How to conduct remote user testing?

No matter how well thought your product is, users will always surprise you. That’s why it's essential to get their opinion before you spend a lot of money on your product development. ...

Kasia Radziejewska
24 June 2020