Axios vs Fetch in React: Why the facebook/react Source Code Doesn't Include HTTP Clients

The facebook/react repository does not contain implementations for axios or fetch; instead, it provides the component architecture, reconciler, and scheduler that enable React applications to integrate with any HTTP client.

While developers frequently debate the differences between axios and fetch when building React applications, the React source code itself focuses exclusively on the UI layer. An analysis of the facebook/react codebase reveals that the library delegates all network operations to external APIs or userland code, concentrating instead on the Fiber reconciler, concurrent scheduling, and component lifecycle management that make data fetching patterns possible.

React Runtime: The Public API Layer

The entry point for all React functionality is packages/react/src/React.js, which exports the APIs that applications import, including React.createElement, hooks, and context providers. This layer intentionally abstracts away platform-specific concerns like HTTP requests, leaving axios and fetch as implementation details for application developers.

Key files in the runtime:

• packages/react/src/React.js – Public API entry point
• packages/react/src/ReactElement.js – JSX element creation
• packages/react/src/ReactHooks.js – Hook implementation (useState, useEffect, etc.)

ReactDOM: The Bridge to Browser APIs

While axios and fetch are browser APIs (or external libraries), ReactDOM handles the bridge between React’s virtual tree and the actual DOM. The file packages/react-dom/src/client/ReactDOMHostConfig.js defines how React interacts with the browser environment, though it explicitly does not implement network request handling.

For root creation and rendering:

• packages/react-dom/src/client/ReactDOMRoot.js – Contains createRoot and render logic for React 18+ concurrent features

The Reconciler: Core Diffing Algorithm

The reconciler, implemented in packages/react-reconciler/src/ReactFiberReconciler.js, is the engine that processes component updates. It implements the Fiber architecture—a linked tree structure where each node represents a unit of work. This system enables React to pause, prioritize, and resume rendering work, which is crucial when integrating with asynchronous data fetching patterns (whether using axios, fetch, or React Server Components).

Key architectural concepts:

• Fiber Architecture – Internal representation in packages/react-reconciler/src/ReactFiber.js
• Concurrent Mode – Cooperative scheduling that yields to the browser
• Effect Scheduling – packages/react-reconciler/src/ReactFiberEffect.js handles side effects like DOM mutations

The Scheduler: Managing Asynchronous Work

React’s cooperative scheduler (packages/scheduler/src/Scheduler.js) determines when to perform work based on browser idle time. This is particularly relevant to data fetching because while axios and fetch manage the network request itself, React’s scheduler determines when to process the resulting state updates and re-renders, ensuring the UI remains responsive during network latency.

React Server Components: Server-Side Data Fetching

While the React core doesn't implement axios or fetch, the experimental React Server Components (RSC) in packages/react-server/src/ReactFlightServer.js demonstrate how React handles server-side rendering and streaming. In this architecture, data fetching typically happens directly on the server using native fetch or database drivers, with the results serialized and streamed to the client—bypassing the need for client-side axios/fetch calls for initial data.

Hooks System: Integrating External Data Sources

The hooks implementation in packages/react/src/ReactHooks.js provides the useEffect and useState primitives that enable developers to integrate axios or fetch into React components. While React doesn't provide a built-in useFetch hook in its core (unlike frameworks like Next.js or TanStack Query), the fiber-based hook list architecture makes it possible to build custom hooks that wrap any asynchronous client:

import {useState, useEffect} from 'react';

export function useWindowWidth() {
  const [width, setWidth] = useState(window.innerWidth);
  useEffect(() => {
    const handleResize = () => setWidth(window.innerWidth);
    window.addEventListener('resize', handleResize);
    return () => window.removeEventListener('resize', handleResize);
  }, []);
  return width;
}

Key files involved:

• Hook registration & state → packages/react/src/ReactHooks.js
• Effect scheduling → packages/react-reconciler/src/ReactFiberEffect.js

Compiler and JSX Transformation

The React compiler (compiler/packages/babel-plugin-react-compiler/src/index.js) transforms JSX syntax into React.createElement calls. This transformation occurs at build time, meaning that whether you use axios or fetch in your component logic, the JSX compilation process remains identical and agnostic to your data fetching strategy.

Summary

• React core does not implement HTTP clients: The facebook/react repository contains no code for axios or fetch; these are external to React's scope.
• Architecture supports any async pattern: The Fiber reconciler (packages/react-reconciler/src/ReactFiberReconciler.js) and Scheduler (packages/scheduler/src/Scheduler.js) enable React to work with any data fetching library through hooks and state management.
• Server Components change the paradigm: React Server Components (packages/react-server/src/ReactFlightServer.js) move data fetching to the server, often using native fetch rather than client-side axios.
• Hooks provide the integration point: packages/react/src/ReactHooks.js implements the primitives (useEffect, useState) that developers use to integrate axios or fetch into components.

Frequently Asked Questions

Does React include axios or fetch in its source code?

No. According to the facebook/react source code analysis, the repository does not contain implementations for axios or fetch. These are either browser Web APIs (fetch) or third-party libraries (axios) that developers use alongside React. The React core focuses exclusively on the UI layer, component lifecycle, and rendering architecture.

How does React handle data fetching if it doesn't include HTTP clients?

React provides the hooks system (packages/react/src/ReactHooks.js) and effect scheduling (packages/react-reconciler/src/ReactFiberEffect.js) that allow components to integrate with any asynchronous data source. Developers typically use useEffect to call fetch or axios, then use useState to manage the resulting data, while React's reconciler handles efficiently updating the UI when the data arrives.

What is the difference between client-side fetching and React Server Components?

While traditional React applications use axios or fetch in the browser (client-side), React Server Components (packages/react-server/src/ReactFlightServer.js) execute on the server and can access databases or native fetch directly. This architecture eliminates the need to send client-side JavaScript for data fetching logic, instead streaming the rendered UI or data to the browser, effectively bypassing the axios vs fetch decision for initial loads.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}