React, originally known as ReactJS or React.js was developed by Jordan Walke at Facebook and was initially used to develop Facebook feed in 2011. It was later used to develop Instagram in 2012. In year 2013, React was open sourced and now it is maintained by the React open source community with the help of Facebook via its website, reactjs.org.
The initial public release of React in May 2013 was open sourced under the Apache License 2.0 license but with major community backlash and feedback on Sept 26, 2017, React 16.0.0 was released under the MIT license.
Some of the popular websites that are used by hundreds of millions of users per day that are developed in React includes Facebook, Instagram, Netflix, Uber, WhatsApp, Venmo, PayPal, Reddit, Salesforce, Airbnb, Dropbox, The New York Times, CNN, and Flipboard.
Why use React?
React is declarative
React is declarative that helps create interactive user interfaces straight forward. React is used to design simple views for each state in your application, and React will efficiently update and render just the right components when your data changes. Declarative views make your code more predictable and easier to debug.
React is simple yet powerful
ReactDOM is the DOM engine of React that makes is not only simple to write and render but also powerful. You can pretty much create HTML on the fly, pass data from JS to HTML, and render entire HTML as an element using ReactDOM.
React is component-based
Components are building blocks of react pages. A page can have multiple components. Each component can manage their own state and represent a part of a page and can have its own data source. You can easily pass rich data through your app and keep state out of the DOM.
React supports mobile development
React Native is growing rapidly and becoming a primary programming language to write native mobile apps. React developers can use their existing skills to build mobile apps using React Native.
Features of React
Let us look at some of the key features of React.
Simple to learn
Faster to render
Elements are the smallest unit of a React app. Think of an element as a variable that can store some value. Here is an example of a React element.
const hello = <h1>Hello React App</h1>;
Elements are easy to create and they are cheap to render. Not only elements are cheap but they also provide control and flexibility on how these elements are rendered.
Unlike browser DOM that manages the rendering of a web page, rendering elements in React is managed by React DOM. ReactDOM.render() is used to render an element.
const hello = <h1>My React App</h1>;
While JSX is not required to write React apps, it is recommend using it to create user interfaces. Think of JSX as a template language.
Here are some of the key properties of JSX,
JSX is like XML that is easy to understand and write.
JSX can be sought as a template language.
JSX represents objects.
JSX is an expression.
JSX prevents injection attacks.
React DOM is another key element of React apps. React DOM is responsible for checking the previous states of the elements and only updates elements are passed to the browser DOMs. That helps app rending process faster. Hence the performance of the app.
Components and states
Components in React are reusable and can be reused in different parts of an app. Each component has its own code, login, and state. Refreshing one component does not affect the performance of other components.
React plays nice with other libraries and frameworks. You can also use React in an existing Web application without changing much.
What is the current version of React?
The current version of React is 17.0. The Release Candidate of v 17.0 was announced on Aug 10, 2020. While this version does not have any new developer focused features. Here is from the release notes.
The React 17 release is unusual because it doesn’t add any new developer-facing features. Instead, this release is primarily focused on making it easier to upgrade React itself.
We’re actively working on the new React features, but they’re not a part of this release. The React 17 release is a key part of our strategy to roll them out without leaving anyone behind.
What is the download size of React?
One of the major concerned developers have is the library download size on the users’ browsers. While there has not been any change in the size in version 17.0, the following are the details from the previous version, 16.0.
Size of React version 16.0.
react is 5.3 kb (2.2 kb gzipped).
react-dom is 103.7 kb (32.6 kb gzipped).
react + react-dom is 109 kb (34.8 kb gzipped).
What is React Native?
Learn more - React Native
React developers who are involved in building back-end development can use Node to build backend sever side applications.
React developers can use their existing skills to build native mobile apps using React Native.