16

As most of you know, HTML5 introduced a standardized browser mechanism called link prefetching, one that allows preloading the content of select URLs in the background, if the browser determines there is no network activity. It's used by adding the following to the head:

<link rel="prefetch" href="http://www.example.com/">

I'm curious if this mechanism works reliably for XMLHttpRequest as well -- in the sense that if I specify a link prefetch, and then sometime later on that very same page initiate an AJAX request, would the XHR be a HTTP byte-range request, or ask for the entire page, effectively ignoring a partially preloaded page?

In english: would the AJAX request benefit from the preloaded or partially preloaded content as well?

John Weisz
  • 30,137
  • 13
  • 89
  • 132

1 Answers1

1

Sort answer YES.

As long as you are performing GET requests (or HEAD requests) the XHR will use the downloaded data from the prefetch.

If at the time of the XHR the prefetched file is still downloading, the download will take standard priority and the XHR will return when the download finishes (this is not always the case)

You can observe all these (at least) on the Network tab at Crome Developer Tools

enter image description here

The first zip is from the prefetch and the second from an XHR request and green is wait, blue is download.

You can actually see the XHR waits for the prefetch to end

MaanooAk
  • 2,418
  • 17
  • 28
  • Needless to say that If the browser does not support the feature, the whole thing becomes a simple XHR request – MaanooAk Jul 28 '17 at 07:52
  • I am unable to reproduce your assertion, in Safari, Firefox, or Chrome. Which variant are you saying works, and does it still work in 2020? – Jason Jan 21 '21 at 22:11