Do you prefer Fetch or Axios?

One of the fundamental tasks of any web application is to communicate with servers through the HTTP protocol. This can be easily achieved using Fetch or Axios.

The Fetch API is built-in most modern browsers and provides a fetch() method defined on the window object, while Axios is a specific 3rd party Javascript library you must install manually.

Which method do you usually use and do you think adding a library (around 4.4KB gzip) is worth it for the extra features it brings?

Comments

[Sooraj (PS)]

If the application needs to be light and have only a few http calls, then I would generally go for either fetch or xmlHTTPRequest.
For applications that are dependent on a lot of HTTP calls, then I think axios is the best approach and its easy to get away with setup.

[Junxiao Shi]

jQuery.ajax()
🤦

[Caleb David]

That legendary function 😂

[Madza]

been there, done that 😂😂

[Pacharapol Withayasakpunt]

axios integrates better with TypeScript interfaces, however, fetch (and well as node-fetch) has much more predictable output.

// Is it `string` or `Record<string, unknown>` (or `Blob`)?
const { data } = await axios.get('/api')

// Nearly always `Record<string, unknown>`
const data2 = await fetch('/api').then((r) => r.json())

Also, fetch can be attached AbortController. I would be interested in a library built on top fetch.

I know there are superagent and ky, but I never really tried.

[Adam Azad]

What about?

interface Fruit {
  id: string;
  name: string;
}

const { data } = await axios.get<Fruit[]>('/fruits');

Now data is an array of objects Fruit

[Pacharapol Withayasakpunt]

Actually, it's just a fake typing.

It depends on the "real" data, whether it gets JSON.parse() or not.

[Caleb David]

I use both, but mostly just stick with fetch and node-fetch 😎

[Sasha]

I would go with axios. It has nice API, and I never felt good with fetch. Dunno why, but axios feels so much more natural to my mind. It's really easy to use.

[Madza]

Same here 😉

[Richard Guay]

I’ve moved from Axios to Fetch. Axios is easier to use, but Fetch doesn’t add anything extra. Therefore, I’m mostly using Fetch now.

[Ryan Dsouza]

I prefer axios's API and also fetch doesn't throw an error when we get a non 200 response from the backend except for Network errors. Which is why I use redaxios, the best of both worlds.

[jan paul]

+1

[TrasherDK]

Fetch can't handle 401 response, with no access to headers. Digest authentication is a problem.

[Rohit]

My opinion is to use axios, because in some cases like if we have to show the progress of our request then it will be very difficult to handle this using fetch method but axios have a good managed function for that case.

Also axios provides good documentation for the function and there use.

[Manav Misra]

fetch is fine. I don't mind the 'double await' Usually, I move 'api' functionality to its own module/file anyway, so I am not typing it more than once.