Codementor Events

ReactJS: Main Features

Published Feb 04, 2020Last updated Feb 05, 2020

ReactJS is an open source frontend JavaScript Library which is used for building simple UI to complex UI and from Single Page Application to Server Side Rendering.
Also developers like this because of writing reusable and modular UI components.

Main Features:

Virtual DOM
Unidirectional Data Flow
Server Side Rendering
Single Page Application
Concurrent Mode (Experimental)

Virtual DOM:

Virtual is a programming concept where an ideal or virtual representation of a UI is kept in a memory and synced with the real DOM by a library called ReactDOM and this whole process is called reconciliation.

Virtual DOM is more of a pattern than a specific technology. In React world, the term Virtual DOM is usually associated with React elements since they are objects representing the user interface. React also uses internal objects called fibers to hold additional information about the component tree. Fiber is the new reconcialiation engine in React 16. It's main goal is to enable incremental rendering of te virtual DOM.

Unidirectional Data Flow:

It is a technique that is used in React like how data will be transferred to other parts of the application. It is also known as one way data binding as well. In React, Data is always flow from parent to child component and data coming from parent component is called props. This means child components are not able to update the data that is coming from the parent component.
Because of unidirection data flow neither parent nor child components can know if a certain component is stateful or stateless and they shouldn’t care whether it is defined as a function or a class. This is why state is often called local or encapsulated. It is not accessible to any component other than the one that owns and sets it. A component may choose to pass its state down as props to its child components.
Any state is always owned by some specific component, and any data or UI derived from that state can only affect components below them in the tree.
If you imagine a component tree as a waterfall of props, each component’s state is like an additional water source that joins it at an arbitrary point but also flows down.

Discover and read more posts from Saurabh Yadav
get started
post comments1Reply
Navdeep Sadyora
4 years ago

Thank you for explaining it in a simple way.