React
What is React?
React is a Java Script library for building fast interactive user interfaces for web as well as mobile applications. It is a an open-source, reusable component based front end library.
In Model View Controller (MVC) Architecture, React is the “View” which is responsible for how the app looks and feel.
Before React JS, developers encounter troubles like less UI-focused React predecessor like jQuery. So, in 2011, Facebook engineer Jordan Walke created React JS specifically to improve UI development.
React divides User Interface into multiple components, which makes the code easier to debug, and each component has its own property and function. Components also make development and maintain faster as multiple developers can work simultaneously on different components of the same application.
Why React JS is so popular in these days?
· Easy creation of dynamic web applications.
· Performance Enhancement.
· Reusable Components.
· Unidirectional Data flow.
· Small learning curve.
· Can be used in mobile apps.
· Dedicated tools for easy debugging.
Features of React
- JSX — Java Script Syntax Extension
JSX is a syntax extension to Java Script. It is used with React to describe what the user interface should look like. By using JSX, you can write HTML structures in the same file that contains Java Script Code. All code in React is done by using JSX.
JSX helps making the code easier to understand and debug as it’s avoids usage of Java Script DOM structures which are rather complex. JSX is a combination of both Java Script and HTML.
2. Virtual DOM
DOM stands for Data Object Model which defines how documents are accessed and manipulated in a web page. It represents entire structure of a web page in a form of tree.
React creates exact copy of the real DOM which is known as virtual DOM. In a traditional situation whenever something changes in web application all objects in real DOM is updating. This is a very slow process.
What React does is suppose there are four objects that change its state. React checks the snapshot of the right before the four objects change its state and compare it with after the four objects that change its state. Then React gets to know which objects have been changed. After that React only update the four objects that changed its state. This kind of selective updating takes less computing power and less loading time.
3. Performance
Virtual DOM impacts the speed of web application which helps to improve performance. Also, as mention above multiple developers can work in different components of a web application helps to improve the performance.
4. One way Data Binding
This means information flows only in one direction. One way data binding is specifically use in when information is displaying and not in updating. React one way data binding keeps everything modular and fast.
5. Extensions
React has many extensions which helps to create full fledge front end applications. It provides sever side rendering. That means application rendering from sever rather than rendering app from browser. React native is React extension which supports mobile app development.
6. Debugging
React applications are extremely easy to test due to a large developer community. Facebook even provides a small browser extension that makes React debugging faster and easier.
