React (software)

React (also known as React.js or ReactJS) is a free and open-source front-end JavaScript library[5][6] that aims to make building user interfaces based on components more "seamless".

[14]: 76  Developers design views for each state of an application, and React updates and renders components when data changes.

[28] Though a similar concept to Server Side Rendering, RSCs do not send corresponding JavaScript to the client as no hydration occurs.

React is primarily a library for building user interfaces, and it does not include a full-fledged routing solution out of the box.

[30] It allows the developer to define routes, manage navigation, and handle URL changes in a React-friendly way.

React creates an in-memory data-structure cache, computes the resulting differences, and then updates the browser's displayed DOM efficiently.

[37] Similar in appearance to HTML,[14]: 11  JSX provides a way to structure component rendering using syntax familiar[14]: 15  to many developers.

This allows the choice of whichever libraries the developer prefers to accomplish tasks such as performing network access or local data storage.

It provides an API that is consistent with Redux, enabling developers to create Redux-like stores that are local to component states.

[48][49] This enables the React community to provide feedback on new potential features, experimental APIs and JavaScript syntax improvements.

React was created by Jordan Walke, a software engineer at Meta, who initially developed a prototype called "F-Bolt"[50] before later renaming it to "FaxJS".

[51] In May 2013, at JSConf US, the project was officially open-sourced, marking a significant turning point in its adoption and growth.

JavaScript functions and virtual DOM objects are called "fibers", and each can be operated and updated separately, allowing for smoother on-screen rendering.

In October 2014, React 0.12.00 replaced this with the 3-clause BSD license and added a separate PATENTS text file that permits usage of any Facebook patents related to the software:[61]The license granted hereunder will terminate, automatically and without notice, for anyone that makes any claim (including by filing any lawsuit, assertion or other action) alleging (a) direct, indirect, or contributory infringement or inducement to infringe any patent: (i) by Facebook or any of its subsidiaries or affiliates, whether or not such claim is related to the Software, (ii) by any party if such claim arises in whole or in part from any software, product or service of Facebook or any of its subsidiaries or affiliates, whether or not such claim is related to the Software, or (iii) by any party relating to the Software; or (b) that any right in any patent claim of Facebook is invalid or unenforceable.This unconventional clause caused some controversy and debate in the React user community, because it could be interpreted to empower Facebook to revoke the license in many scenarios, for example, if Facebook sues the licensee prompting them to take "other action" by publishing the action on a blog or elsewhere.

Many expressed concerns that Facebook could unfairly exploit the termination clause or that integrating React into a product might complicate a startup company's future acquisition.

[62] Based on community feedback, Facebook updated the patent grant in April 2015 to be less ambiguous and more permissive:[63] The license granted hereunder will terminate, automatically and without notice, if you (or any of your subsidiaries, corporate affiliates or agents) initiate directly or indirectly, or take a direct financial interest in, any Patent Assertion: (i) against Facebook or any of its subsidiaries or corporate affiliates, (ii) against any party if such Patent Assertion arises in whole or in part from any software, technology, product or service of Facebook or any of its subsidiaries or corporate affiliates, or (iii) against any party relating to the Software.

[65] In August 2017, Facebook dismissed the Apache Foundation's downstream concerns and refused to reconsider their license.

[68] On September 23, 2017, Facebook announced that the following week, it would re-license Flow, Jest, React, and Immutable.js under a standard MIT License; the company stated that React was "the foundation of a broad ecosystem of open source software for the web", and that they did not want to "hold back forward progress for nontechnical reasons".

These frameworks often extend or enhance features available through native web technologies, such as routing, component-based development, and state management.

While native web standards, including Web Components, modern JavaScript APIs like Fetch and ES Modules, and browser capabilities like Shadow DOM, have advanced significantly, frameworks remain widely used for their ability to enhance developer productivity, offer structured patterns for large-scale applications, simplify handling edge cases, and provide tools for performance optimization.

[72][73][74] Frameworks can introduce abstraction layers that may contribute to performance overhead, larger bundle sizes, and increased complexity.

Modern frameworks, such as React 18, address these challenges with features like concurrent rendering, tree-shaking, and selective hydration.

While these advancements improve rendering efficiency and resource management, their benefits depend on the specific application and implementation context.

Lightweight frameworks, such as Svelte and Preact, take different architectural approaches, with Svelte eliminating the virtual DOM entirely in favor of compiling components to efficient JavaScript code, and Preact offering a minimal, compatible alternative to React.

Framework choice depends on an application’s requirements, including the team’s expertise, performance goals, and development priorities.

There is a Virtual DOM that is used to implement the real DOM
Updates to realDOM are subject to virtualDOM
The virtualDOM will update the realDOM in real-time effortlessly