Why use React

In our project, we use React for handling frontend business. Our project is a web-based application, in which interactivity is required, views that are dynamically transformed are something common in the project.

In this post, I will write why we choose to use React.


Writing React is Easy

Writing codes in React is extremely easy. Once you grasp the ideas, transforming them into codes are very easy. By default (recommended), React uses a special syntax called JSX. By using JSX, we can write HTML alongside Javascript, and this is fantastic when we are writing a function that has to meddle with DOM tags.

import React, { Component } from 'react';

class DemoView extends Component {
  render() {
    return (
      
Cat Demo View
); } }

Thinking in React is wonderful

React is based on uni-directional data flow. In which data flow only in a single direction from parent to children. This is contrast to 2-way data binding concept, in which changes in the DOM may directly update the data (hello, Angular!)

Cited from javascript-scene, React’s update cycle flow can be described as the following.

  1. React takes inputs to components as props and conditionally renders DOM updates if data has changed for specific parts of the DOM. Data updates during this phase can’t retrigger the render until the next drawing phase.
  2. Event handling phase — after the DOM has rendered, React automatically delegates DOM events to a single event listener at the root of its DOM tree (for better performance). You can listen for events and update data in response.
  3. Using any changes to the data, the process repeats at 1.

 


Performance

Performance-wise, React is very efficient. In the inside, React create its own virtual DOM where the components live. The React’s virtual DOM is optimized to be able to respond to changes (such as changing props or state) quickly. React calculates what changes needed to be made and updates the DOM tree accordingly, hence avoids unnecessary and costly DOM operations.


Supports

React is extremely popular and has a very wide community in public. Almost every problems that you face during your frontend development have already had their answers in StackOverflow. In a 2016 StackOverflow developer survey, the data showed that React.Js’s popularity had recently increased by over 300%.


Why not others?

In the earlier time, we are considering to go for Angular (or Angular 2). After some consideration, we decide to go for React because:

  1. React is simpler. While Angular is a full-pledged framework, providing factories, controllers, and views; React is a javascript library intended to handle only the view layer.
  2. React is much more popular, and many big popular apps are using React. e.g. Spotify Web Player, Facebook.

References:
View story at Medium.com
https://blog.syncano.io/reactjs-reasons-why-part-1/
http://jsx.github.io/
https://insights.stackoverflow.com/survey/2016
View story at Medium.com

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s