XHR vs Fetch

Hey ,

I'm thrilled to help you learn JavaScript. Unfortunately, you've landed on a page where you cannot access with your current purchase.

Please upgrade (use this link) access this content.

I'm super eager to help you learn more!

XHR vs Fetch

Which should you use? XHR or Fetch?

Why use XHR

XHR uses a callback pattern which you are familiar with. You may find it easier to understand.

XHR has two more features compared to Fetch (at the time of writing):

One. You can track the progress of a request with XHR, but you cannot track the progress of a request with Fetch.

Two. You can cancel both XHR and Fetch requests, but canceling requests with Fetch isn’t well supported across browsers yet.

Why use Fetch

Fetch uses JavaScript promises. Promises are powerful. They let you handle complex requests easily compared to events and callbacks. You’ll learn more about promises in the next module.

Fetch is actively worked on. It’ll get more features in future. It can be used in newer technologies like Service Workers as well.

Wrapping up

Use XHR if:

  1. You need to track the progress of a request
  2. You need the ability to cancel requests

Otherwise, use Fetch.