Axios vs Got vs Fetch Polyfills: Architecture & Runtime Compared

When architecting data layers for modern web applications, the choice of HTTP client impacts everything from bundle size to error handling strategies. axios, got, isomorphic-fetch, and node-fetch all solve the same fundamental problem — making HTTP requests — but they approach it from different angles. Let's compare how they handle real-world engineering scenarios.

🌍 Runtime Environment: Isomorphic vs Node-Only

axios is truly isomorphic.

• It uses XMLHttpRequest in the browser and the native http module in Node.js.
• You can share the same request logic between client and server without changes.

// axios: Works in Browser and Node
import axios from 'axios';
const res = await axios.get('/api/data');

got is strictly for Node.js.

• It relies on Node-specific APIs like http and tls.
• Importing it in a browser bundle will cause build errors or runtime crashes.

// got: Node.js Only
import got from 'got';
const res = await got.get('https://api.example.com/data');

isomorphic-fetch polyfills the global environment.

• It injects fetch into the global scope for both Node and older browsers.
• This can cause conflicts if other libraries also try to polyfill fetch.

// isomorphic-fetch: Global Polyfill
import 'isomorphic-fetch';
const res = await fetch('/api/data'); // Uses injected global

node-fetch is for Node.js environments.

• It implements the fetch standard specifically for server-side JavaScript.
• In modern Node (v18+), native fetch makes this package less critical.

// node-fetch: Node.js Implementation
import fetch from 'node-fetch';
const res = await fetch('https://api.example.com/data');

📝 Request Syntax & Response Handling

axios wraps the response in an object and parses JSON automatically.

• You access data via response.data.
• No need to call .json() manually, which reduces boilerplate.

// axios: Auto-parsed JSON
const response = await axios.get('/api/user');
console.log(response.data); // Direct access to parsed body

got also simplifies response handling but returns a plain object.

• It automatically parses JSON if the Content-Type header matches.
• Access the body directly via response.body.

// got: Auto-parsed JSON
const response = await got.get('https://api.example.com/user');
console.log(response.body); // Direct access to parsed body

isomorphic-fetch follows the strict Fetch API standard.

• Responses are not parsed automatically.
• You must explicitly call .json() to read the payload.

// isomorphic-fetch: Manual JSON parsing
const response = await fetch('/api/user');
const data = await response.json(); // Explicit parsing required

node-fetch mirrors the standard Fetch API behavior.

• Like isomorphic-fetch, it requires manual parsing.
• This aligns with browser fetch but adds extra lines of code.

// node-fetch: Manual JSON parsing
const response = await fetch('https://api.example.com/user');
const data = await response.json(); // Explicit parsing required

⚠️ Error Handling Strategies

axios throws an error for any HTTP status outside 2xx.

• You catch network errors and HTTP errors in the same catch block.
• The error object contains the response, request, and status code.

// axios: Throws on 4xx/5xx
try {
  await axios.get('/api/protected');
} catch (error) {
  if (error.response) console.log(error.response.status);
}

got provides detailed error classes for different failure types.

• It distinguishes between RequestError, HTTPError, and TimeoutError.
• This granularity helps in writing precise retry logic.

// got: Detailed Error Classes
try {
  await got.get('https://api.example.com/protected');
} catch (error) {
  if (error instanceof got.HTTPError) console.log(error.response.statusCode);
}

isomorphic-fetch does not throw on HTTP errors (4xx/5xx).

• It only rejects the promise on network failures (e.g., DNS down).
• You must manually check response.ok to handle HTTP errors.

// isomorphic-fetch: Manual Error Check
const response = await fetch('/api/protected');
if (!response.ok) {
  throw new Error(`HTTP error! status: ${response.status}`);
}

node-fetch behaves identically to the standard Fetch API.

• It does not reject promises for HTTP error statuses.
• Developers must implement manual status checks to avoid silent failures.

// node-fetch: Manual Error Check
const response = await fetch('https://api.example.com/protected');
if (!response.ok) {
  throw new Error(`HTTP error! status: ${response.status}`);
}

🛠️ Advanced Features: Interceptors vs Hooks

axios uses interceptors to modify requests or responses globally.

• Ideal for attaching auth tokens or logging every request.
• You can register multiple interceptors that run in sequence.

// axios: Request Interceptors
axios.interceptors.request.use(config => {
  config.headers.Authorization = 'Bearer token';
  return config;
});

got uses hooks to achieve similar goals with more control.

• Hooks can be defined per-request or globally via an extended instance.
• They support async operations before redirection or finalization.

// got: Hooks
const api = got.extend({
  hooks: {
    beforeRequest: [
      options => { options.headers.authorization = 'Bearer token'; }
    ]
  }
});

isomorphic-fetch has no built-in interception mechanism.

• To modify headers globally, you must wrap fetch in a custom function.
• This adds maintenance overhead compared to built-in interceptor systems.

// isomorphic-fetch: Custom Wrapper
const originalFetch = fetch;
const fetchWithAuth = (url, opts = {}) => {
  opts.headers = { ...opts.headers, Authorization: 'Bearer token' };
  return originalFetch(url, opts);
};

node-fetch also lacks native interceptors.

• Like isomorphic-fetch, you need to create a wrapper function for global logic.
• This is a common pattern when using the standard Fetch API without extra libraries.

// node-fetch: Custom Wrapper
const originalFetch = fetch;
const fetchWithAuth = (url, opts = {}) => {
  opts.headers = { ...opts.headers, Authorization: 'Bearer token' };
  return originalFetch(url, opts);
};

📅 Maintenance & Future Proofing

axios remains actively maintained with a large community.

• It adapts to new environments but retains its legacy API surface.
• A safe bet for long-term projects requiring stability.

got is actively developed for the Node ecosystem.

• It embraces modern JavaScript features and ESM.
• Best choice for server-side tools that need reliability.

isomorphic-fetch is considered legacy in modern stacks.

• Native fetch is now available in all major browsers and Node 18+.
• New projects should avoid this dependency unless supporting very old clients.

node-fetch is stable but less critical with Node 18+.

• Version 3 requires ESM, which may break older CommonJS projects.
• Use native fetch in new Node projects where possible.

📊 Summary: Key Differences

💡 The Big Picture

axios is the pragmatic choice for full-stack teams 🧰. It reduces boilerplate with auto-parsing and interceptors, making it ideal for dashboards, admin panels, and apps where client/server code sharing matters.

got is the power user's tool for Node.js 🔧. If you are building backend services, CLI tools, or scripts, its advanced retry logic and error details save hours of debugging.

isomorphic-fetch and node-fetch are for standard-compliance purists 📜. They are useful if you want to match browser fetch behavior exactly, but be aware that isomorphic-fetch is fading in favor of native implementations.

Final Thought: For most modern frontend architectures, native fetch (with a small wrapper for error handling) or axios (for interceptors) are the top contenders. Reserve got for dedicated Node.js services where its specific strengths shine.