Rel PreRender/PreFetch, does it execute JS?

Question

<!—Firefox Prefetching -->
<link rel="prefetch" href="http://www.example.com/page2.html">

<!—Chrome Prefetching -->
<link rel="prerender" href="http://www.example.com/page2.html">

If I had Javascript on the page to prerender/prefetch (such as Google Analytics JS), will the prerender/prefetch execute Javascript on the page? Or does it delay any execution of JS until the page is actually requested by the user?

Acetamide

Just done some more research and answered the question myself, and it's interesting to note that prefetch and prerender behave quite differently to each other. – Acetamide

Answer 1

I've just done some more research on this:

Prefetch will load the top level resource which is often simply the HTML page

Prerender will fetch child elements as well, and will execute Javascript code. Using the Page Visibility API we can determine the current visibility state of the loaded page.

So the answer is yes, it will execute JS as long as the user is on Chrome and prerender is being used. Also, the current version of Google Analytics makes full use of the Page Visibility API so statistics wont be skewed, however it's likely there is a lot of code in the wild whose statistics are being skewed by not properly handling cases of prerendering.

Acetamide

Actually, they are purposefully different commands. prefetch can be used on resources you'd like to prefetch (a script, an image, an html file, whatever), while prerender is for prerendering a complete page that you (hopefully) knows is highly likely to be visited next, and very soon, by your user. Could be for example the login page for your forum, or something like that. prefetch is supported by chrome, ff, ie and edge. prerender is supported by chrome, ie and edge. (although check caniuse.com for up to date support...) – Nicolettenicoli

Do you have an official source from Google that says Google Analytics knows how to ignore prefetch hits? – Wordless

Answer 2

No, prefetching just cache the file, it doesn't execute javascript it contains.

As I know analytics.js doesn't analyze website when you request it. It works when it's javascript executed. When browser prefetch(request) an analytics.js file that doesn't mean the analytics.js file is executed. So Google Analytics Data of your website will not be affected by prefetching method until the page is actually requested by the user.

Heed

Answer 3

On the subject the spec is mute and simply states:

The prefetch keyword indicates that preemptively fetching and caching the specified resource is likely to be beneficial, as it is highly likely that the user will require this resource.

From this we can say that the execution of JS in prefetched pages is undefined.

Whether a browser vendor sees benefit in executing JS in prefetched pages is down to the vendor.

Poseur

I've just found out prefetch only loads the top level element, prerender however will fetch all child elements and will execute JS. – Acetamide