React
Last reviewed
Jun 11, 2026
Sources
20 citations
Review status
Source-backed
Revision
v2 ยท 4,099 words
Improve this article
Add missing citations, update stale details, or suggest a clearer explanation.
Suggest edit
CtrlK
Last reviewed
Jun 11, 2026
Sources
20 citations
Review status
Source-backed
Revision
v2 ยท 4,099 words
Add missing citations, update stale details, or suggest a clearer explanation.
React (sometimes called React.js or ReactJS) is a free, open source JavaScript library for building user interfaces.[1] It uses a component model and a virtual DOM to render UI declaratively, and it has become the dominant front end technology for the web.[2] Created by Jordan Walke at Facebook in 2011 and open sourced at JSConf US on May 29, 2013, React was maintained by Meta for over a decade before it was donated to the Linux Foundation as the React Foundation in February 2026.[11] Almost every major consumer AI product, including ChatGPT, Claude.ai by Anthropic, Perplexity, and Google Gemini's web app, ships a React based interface, which makes the library central to how people interact with large language models today.
| Original author | Jordan Walke |
| Developer | React Foundation (formerly Meta and the open source community) |
| Initial release | May 29, 2013 |
| Stable release | 19.2.5 (April 8, 2026) |
| Repository | github.com/facebook/react |
| Written in | JavaScript |
| Platform | Web platform, JavaScript engines |
| Type | JavaScript library, web framework |
| License | MIT License |
| Website | react.dev |
React began as an internal project at Facebook. Software engineer Jordan Walke created an early prototype called FaxJS in 2011, drawing on ideas from XHP, a PHP component library Facebook used to render HTML on the server.[18] The motivation was practical: Facebook's news feed had grown into a sprawling client side application, cascading state changes were hard to reason about, and the team wanted a way to declare what the UI should look like rather than imperatively manipulating the DOM.
Facebook deployed React on its news feed in 2011, then on Instagram after acquiring the company in 2012.[2] Pete Hunt, a Facebook engineer, pushed for an open source release after seeing how the library improved internal productivity.[18]
Jordan Walke unveiled React publicly at JSConf US on May 29, 2013.[2] The reception was famously mixed. Many developers were skeptical of JSX, which let you write HTML like syntax inside JavaScript files. The prevailing wisdom at the time held that markup and logic should live in separate files, so mixing them looked like a step backward. Pete Hunt's follow up talk "Rethinking Best Practices" at JSConf EU later that year argued the inverse: components naturally couple markup and logic because they are two views of the same concern, and separating them by file type creates artificial seams.[18]
The initial open source release was version 0.3.0.[20] Within a year, Khan Academy, Yahoo Mail, and Atom adopted React, and Airbnb began porting parts of its site.[18]
At Facebook's F8 conference on March 26, 2015, the company open sourced React Native, a framework that used React's component model to build native iOS and Android apps.[8] The slogan changed from "learn once, write everywhere" to "learn once, write anywhere," reflecting the team's view that you should not expect a single codebase to cover every platform but should be able to carry your skills across platforms. React Native shipped Facebook Ads Manager and parts of the main Facebook app within months.[8]
React 0.14, released in October 2015, separated the package into two: react (the core library) and react-dom (the renderer that targets the browser DOM).[20] The split made it easier to support alternative renderers like React Native, React TV, and various canvas backends. It also signaled that React was an abstraction over UI rather than a web framework specifically.
React 15 shipped in April 2016 with a stricter virtual DOM and improved server side rendering.[20] The bigger story that year was licensing. Facebook released React under a BSD 3 clause license combined with a separate patent grant. The patent grant was conditional: if you sued Facebook for patent infringement on any of its products, you lost your right to use React.[9]
The arrangement triggered a backlash in 2017. The Apache Software Foundation banned BSD plus Patents licensed code from its projects. WordPress, which had been planning to rebuild its admin interface on React via the Calypso project, announced in September 2017 that it would move to a different library. Within weeks, Facebook reversed course. On September 22, 2017, Adam Wolff posted on the engineering blog that React, Jest, Flow, and Immutable.js would relicense under the MIT License.[10] The 16.0.0 release on September 26, 2017 was the first under MIT.[10]
React 16 shipped on September 26, 2017, and replaced the original "stack" reconciler with a new one called Fiber.[20] The stack reconciler walked the component tree synchronously: once it started, it could not stop until it finished. On large updates that meant dropped frames and unresponsive input. Fiber broke rendering work into small units that the scheduler could pause, resume, and prioritize, laying the groundwork for the concurrent features that would arrive years later. Fiber also added error boundaries, fragments, portals, and the ability for components to return arrays or strings.[1]
React 16.8, released on February 6, 2019, introduced Hooks.[20] Before Hooks, components that needed local state had to be written as JavaScript classes, which carried significant boilerplate and quirks around this binding. Hooks let you use state, lifecycle, and context inside plain functions. The core hooks were useState, useEffect, useContext, useReducer, useMemo, useCallback, and useRef, with custom hooks built on top.[1]
The Hooks proposal had been previewed by Sophie Alpert and Dan Abramov at React Conf 2018, where the audience reportedly applauded for so long that the speakers had to wave them off.[18] Hooks reshaped how React code was written. Within a year or two, most new React code was function based.
On December 21, 2020, Dan Abramov, Lauren Tan, Joseph Savona, and Sebastian Markbage introduced React Server Components (RSC) in a research preview titled "Zero Bundle Size React Server Components."[7] The idea was to let some components run only on the server, fetch data directly from databases or APIs, and send their output to the client without shipping their JavaScript.[7] Server Components composed seamlessly with regular client components in the same tree.
RSC was experimental for years and only became widely usable through Next.js 13 in late 2022, which built its App Router on top of the new model.
React 17 was unusual: it was a release with almost no new features for users.[2] It changed the event delegation model so React no longer attached handlers to the document, made it easier to upgrade parts of an app independently, and removed the older event pooling behavior. Dan Abramov framed it as a stepping stone, a release whose value was making future upgrades less painful.
React 18 went stable on March 29, 2022, after a release candidate earlier in the month.[6] It introduced concurrent rendering as a real, opt in feature: useTransition and startTransition let updates be marked as non urgent so React could interrupt them when more important work arrived.[6] Other additions included automatic batching across promises, timeouts, and event handlers, the new useId hook, streaming SSR with Suspense for data fetching, and the new createRoot API.[6]
React 19 shipped on December 5, 2024.[4] Its headline feature was Actions, a pattern for handling form submissions and other async work with built in pending, error, and optimistic state.[4] New hooks included useActionState, useFormStatus, and useOptimistic. The use hook let components read promises and context inline, suspending until they resolved.[4] React 19 also marked Server Components as stable, integrated <form> actions directly, and added support for document metadata and resource preloading.[4] The React Compiler, a build time optimizer that auto memoizes components, shipped a 1.0 release alongside React 19.[4]
React 19.1 followed in March 2025 with a focus on stability and ecosystem fixes.[20] React 19.2, released on October 1, 2025, added the <Activity> component for declaratively hiding and unmounting parts of the tree, the useEffectEvent hook, batched server side rendering improvements, and updated DevTools.[5] The current stable release as of April 8, 2026 is 19.2.5, which adds protections against malformed Server Component payloads.[20]
In October 2025, Meta announced its intent to donate React, React Native, and the JSX project to a new independent foundation hosted by the Linux Foundation.[13] The transfer completed on February 24, 2026 with the public launch of the React Foundation.[11] Eight platinum founding members back the foundation: Amazon, Callstack, Expo, Huawei, Meta, Microsoft, Software Mansion, and Vercel.[12] Seth Webster serves as executive director.[11] Technical governance remains separate from the foundation board and is set by React's contributors and maintainers.[11]
The component is the unit of composition in React.[1] A component is a JavaScript function that returns a description of what should appear on screen, expressed in JSX. Components accept inputs called props and can hold internal state. Composition is the primary form of code reuse: small components combine into bigger ones, and the same component renders differently based on the props it receives.[1]
There are two kinds of components: function components (the default since 2019) and class components (legacy, still supported). A simple function component looks like this:
function Greeting({ name }) {
return <h1>Hello, {name}</h1>;
}
JSX, short for JavaScript XML, is a syntax extension that lets you write XML or HTML like markup inside a JavaScript file.[1] JSX is not part of the JavaScript language itself; it is a transform handled by Babel, esbuild, SWC, or TypeScript. The transform converts JSX expressions into calls to React.createElement (or, since React 17, an internal jsx function), which produce plain JavaScript objects describing the UI.[1]
Using JSX is optional. You can write React.createElement("div", null, "hi") directly. Almost no one does, because JSX reads more naturally and tooling support is excellent.
React does not write to the browser DOM on every state change. Instead, it builds an in memory tree of plain JavaScript objects, the virtual DOM, and diffs the new tree against the old one on each update.[1] Only the differences are applied to the real DOM. This decouples the rendering model from the DOM's awkward imperative API and lets the same component code drive other targets (native UI, terminal, canvas, even PDF generation).
The diffing algorithm, called reconciliation, was rewritten in 2017 as part of the Fiber project.[2] The Fiber reconciler can split work across multiple frames and prioritize urgent updates over background ones, which makes large React trees feel more responsive.
Props are the inputs to a component, passed in from the parent. They are read only inside the component.[1] State is internal data that a component manages itself, declared with useState or useReducer. When state changes, React schedules a re render of that component and any children that depend on the changed value. Data flows one way, from parent to child, which makes the system easier to reason about than two way binding frameworks.[1]
Hooks are functions that let you tap into React's state and lifecycle features from inside function components.[1] The built in hooks include:
| Hook | Purpose |
|---|---|
useState | Local component state |
useEffect | Side effects after render (subscriptions, fetches, manual DOM work) |
useContext | Read a context value |
useReducer | State managed by a reducer function |
useMemo | Memoize an expensive computation |
useCallback | Memoize a callback so child components do not re render unnecessarily |
useRef | A mutable container that survives re renders |
useTransition | Mark updates as non urgent |
useOptimistic | Show optimistic UI while a mutation is pending |
useActionState | Track the state of a form action |
use | Read a promise or context inline (React 19) |
You can also write custom hooks by composing built in ones. Custom hooks share stateful logic between components without inheritance or higher order component wrappers.[1]
React Server Components run only on the server, return serialized output to the client, and do not ship their JavaScript bundle to the browser.[7] They can read directly from databases or call internal services without a separate API layer.[7] Client components, the regular kind, run in the browser and can use state and effects. The two kinds compose freely: a Server Component can render a Client Component and pass it props.[7]
Server Components were experimental from December 2020 until React 19 marked them stable in December 2024.[4] Next.js' App Router was the first production framework to use them at scale.
Suspense is a mechanism for declaratively handling loading states.[6] A <Suspense fallback={...}> boundary catches any child that is waiting on data or code, and shows the fallback until the child is ready. Combined with concurrent rendering, Suspense lets you show new UI in pieces as data streams in rather than waiting for everything to load.[6]
Strict Mode is a development only wrapper that intentionally double invokes effects, renders, and constructors to surface bugs related to side effects, mutable state, and outdated lifecycle assumptions.[1] It does nothing in production builds.
| Version | Release date | Notable changes |
|---|---|---|
| 0.3.0 | May 29, 2013 | First public release at JSConf US |
| 0.12 | October 2014 | New JSX transform, key warnings |
| 0.13 | March 2015 | ES6 class component support |
| 0.14 | October 2015 | Split into react and react-dom packages |
| 15.0 | April 2016 | Stable virtual DOM rewrite, no more data-reactid |
| 16.0 | September 2017 | Fiber reconciler, fragments, portals, error boundaries, MIT relicense |
| 16.3 | March 2018 | New Context API, forwardRef |
| 16.6 | October 2018 | React.memo, React.lazy, Suspense for code splitting |
| 16.8 | February 2019 | Hooks |
| 17.0 | October 2020 | No new features, gradual upgrade story |
| 18.0 | March 2022 | Concurrent rendering, automatic batching, useId, streaming SSR |
| 19.0 | December 2024 | Actions, use hook, stable Server Components, React Compiler 1.0 |
| 19.1 | March 2025 | Stability fixes, owner stacks |
| 19.2 | October 2025 | <Activity>, useEffectEvent, batched SSR, DevTools updates |
| 19.2.5 | April 8, 2026 | Server Component cycle protections (current stable) |
React is a library, not a full framework. It does not ship routing, data fetching, or build tooling.[1] The ecosystem fills those gaps. The most influential meta frameworks built on React are listed below.
| Framework | Initial release | Maintainer | What it adds |
|---|---|---|---|
| Next.js | October 2016 | Vercel | File based routing, SSR, RSC App Router, image optimization, edge runtime |
| Gatsby | May 2015 | Netlify (acquired 2023) | Static site generation, GraphQL data layer, plugin ecosystem |
| Remix | November 2021 | Shopify (acquired 2022) | Nested routing, loaders and actions, server first data flow |
| Create React App | July 2016 | Meta | Zero config bundler setup (deprecated in 2023) |
| Vite | February 2020 | Evan You and contributors | Fast dev server and bundler, popular with React via the React plugin |
| RedwoodJS | November 2020 | Tom Preston Werner et al. | Full stack framework with Prisma and GraphQL |
| Expo | January 2017 | Expo team | Toolchain for React Native including OTA updates and managed builds |
State management libraries form another large category. Redux, written by Dan Abramov and Andrew Clark in 2015, dominated for years. Newer options include Zustand, Jotai, Redux Toolkit, MobX, Recoil (now in maintenance), and TanStack Query for server state. Form libraries like React Hook Form and Formik handle the parts React intentionally leaves to userland.
React Native lets you build native mobile apps using the same component model as React for the web.[19] Components map to platform widgets (UIView on iOS, android.view.View on Android) rather than DOM elements.[19] Released in March 2015 for iOS and September 2015 for Android, React Native is used by Discord, Microsoft Teams, Shopify, Coinbase, Tesla, and parts of the main Facebook and Instagram apps.[19]
Meta rebuilt React Native's architecture between 2018 and 2024 in a project called Fabric. The new architecture removed the asynchronous bridge that had been a performance bottleneck and unified rendering with React's Fiber reconciler. The new architecture became the default in React Native 0.76 in October 2024.[19]
React is the default front end for consumer AI products. The largest AI labs all ship React based interfaces:
| Product | Company | Front end stack |
|---|---|---|
| ChatGPT web app | OpenAI | React, Next.js |
| Claude.ai | Anthropic | React, Next.js |
| Google Gemini web app | React based | |
| Perplexity | Perplexity AI | React, Next.js |
| Cursor | Anysphere | React (Electron) |
| Vercel v0 | Vercel | React, Next.js |
| Anthropic Console | Anthropic | React |
| OpenAI Playground | OpenAI | React |
| Hugging Face Spaces | Hugging Face | React for many Space templates |
Several patterns recur in these apps. Streaming chat output is rendered token by token using Server Sent Events or fetch streams, with React state updated on each chunk. Suspense boundaries provide fallback UI for tool calls and document parsing. Server Components are used to keep API keys and prompts on the server while sending only rendered output to the client.[7]
The Vercel AI SDK is a TypeScript toolkit for building AI applications, with first class React support.[17] Its useChat hook handles the conversation loop: it sends user messages to a backend route, parses the streaming response, and updates the messages array as tokens arrive.[17] The SDK abstracts over OpenAI, Anthropic, Google, Mistral, and dozens of other providers, so you can swap models without rewriting the UI.[17] The companion library AI Elements ships pre built React components for chat bubbles, message lists, code blocks, and tool call displays.
React Server Components and the related streamUI and createStreamableUI functions in the AI SDK let server code stream React components themselves to the client, not just text.[17] This means an AI response that decides to render a chart, a stock ticker, or an interactive form can do so by returning a Server Component, which the runtime serializes and the client mounts as it arrives. Anthropic's Artifacts feature in Claude.ai uses similar techniques to render interactive code outputs alongside chat.
A crop of React component libraries has appeared specifically for AI interfaces. assistant-ui ships chat components with provider integrations for OpenAI, Anthropic, Mistral, Bedrock, Azure, Gemini, Hugging Face, Cohere, and Ollama. shadcn/ui's AI components include message threads, prompt inputs, and tool result panels. CopilotKit provides hooks for embedding AI agents inside existing React apps with shared state.
React is the most widely used front end library in the world by most measures. The 2024 Stack Overflow Developer Survey put it at roughly 41 percent of professional respondents.[16] The 2024 State of JavaScript survey found React at 81 percent of respondents reporting they had used it, and the 2025 Stack Overflow numbers showed React at 44.7 percent of all developers, well ahead of Angular (18.2 percent), Vue (17.6 percent), and Svelte (7.2 percent).[15]
The react package on npm pulls more than 30 million weekly downloads. The Facebook React repository on GitHub has over 245,000 stars and 51,000 forks.[3] Sites that build their interfaces on React include Facebook, Instagram, WhatsApp Web, Netflix, Airbnb, Uber, Shopify, Twitter (now X), Reddit, Discord, Notion, Linear, Figma, and the AI products listed above.
Developer sentiment is high but not unanimous. The 2024 State of React survey found 87 percent of React developers planned to keep using it.[14] Svelte and Solid both score higher on "would use again" measures, though their absolute user counts are much smaller.
| Framework | First release | Approach | Bundle size (hello world, gzip) | Notes |
|---|---|---|---|---|
| React | 2013 | Component model with virtual DOM | Around 45 KB (react + react-dom) | Largest ecosystem, requires meta framework for routing |
| Vue | 2014 | Component model with virtual DOM and reactivity | Around 34 KB | Single file components, official router and store |
| Angular | 2016 (Angular 2 rewrite) | Full framework with TypeScript first design | Around 130 KB | Backed by Google, batteries included, used heavily in enterprise |
| Svelte | 2016 | Compiler that emits direct DOM updates | Around 10 KB | No virtual DOM, smallest bundles, SvelteKit for full stack |
| Solid | 2021 | Fine grained reactivity with JSX syntax | Around 12 KB | Closest to React's API but uses signals, often tops perf benchmarks |
| Preact | 2015 | React API compatible alternative | Around 4 KB | Tiny drop in for some React apps |
| Lit | 2018 | Web Components with a thin templating layer | Around 6 KB | Standards based, used by Google and IBM |
| Qwik | 2022 | Resumable hydration model | Around 1 KB initial JS | Designed for very fast first paint via O(1) hydration |
Bundle sizes are approximate and depend on the version, build settings, and what features you import. They are useful as orders of magnitude rather than precise numbers.
React's influence on web development is hard to overstate. The component model it popularized, declarative UI in plain JavaScript with one way data flow, is now the standard most other libraries imitate. Hooks reshaped how function based UI code is written across many languages and frameworks. JSX is widely supported in tools that have nothing to do with React.
Criticisms have been consistent over the years. The library is not opinionated about routing, data fetching, or styling, which means every team has to make a stack of choices that other frameworks make for them. The Hooks model has tricky edge cases around stale closures and effect dependencies. Server Components were widely seen as poorly explained at first and remain controversial because they tie React more tightly to specific frameworks (mainly Next.js) and runtime models. The React Compiler is welcome but means yet another layer to understand.
The BSD plus Patents license episode in 2017 damaged trust in Facebook's stewardship of the project, and the donation to the Linux Foundation in 2026 was framed in part as a long delayed answer to those concerns.[9]
Performance critiques recur as well. SolidJS, Svelte, and Qwik all post better numbers than React on common benchmarks. React's response has generally been that absolute speed matters less than how easy it is to keep an app fast as it grows, which is what concurrent rendering and the React Compiler aim at. Whether that argument holds for any given product is something teams keep arguing about.