According to Ilya Grigorik, a developer advocate at Google, when you tap on a Google Search result after performing a mobile search, the page will now load 100-150 milliseconds faster in Chrome for Android. Thanks to a “reactive prefetch,” browsers (currently only Chrome for Android) begin fetching not only the destination pages that are being accessed, but they also are told of other critical resources that need to be fetched in parallel “to speed up rendering.”
Grigorik noted in an explanation on his Google+ page that Search and Chrome aren’t “speculatively prefetching” resources, they are instead waiting for user clicks, which tell browsers other resources that need to be fetched, hence the “reactive” term being associated.
All you really need to know is speed. We love speed, especially when it involves the loading of web pages.
Here is the full explanation of this speedy new “feature” from Grigorik:
Google mobile search is getting faster – to be exact, 100-150 milliseconds faster!When you click on one of the search results, the browser begins fetching the destination page… and here’s the trick: we also provide a hint to the browser indicating which other critical resources it should fetch in parallel to speed up rendering of the destination page!
This is a powerful pattern and one that you can use to accelerate your site as well. The key insight is that we are not speculatively prefetching resources and do not incur unnecessary downloads. Instead, we wait for the user to click the link and tell us exactly where they are headed, and once we know that, we tell the browser which other resources it should fetch in parallel – aka, reactive prefetch!
As you can infer, implementing the above strategy requires a lot of smarts both in the browser and within the search engine… First, we need to know the list of critical resources that may delay rendering of the destination page for every page on the web! No small feat, but the Search team has us covered – they’re good like that. Next, we need a browser API that allows us to invoke the prefetch logic when the click occurs: the search page listens for the click event, and once invoked, dynamically inserts prefetch hints into the search results page. Finally, this is where Chrome comes in: as the search results page is unloaded, the browser begins fetching the hinted resources in parallel with the request for the destination page. The net result is that the critical resources are fetched much sooner, allowing the browser to render the destination page 100-150 milliseconds earlier.
P.S. Currently, reactive prefetch is only enabled for users of Google Chrome on Android, as it is the only browser that supports (a) dynamically inserted prefetch hints, and (b) reliably allows prefetch requests to persist across navigations. We hope to add support for other browsers once these features become available!
Via: +Ilya Grigorik
Some of our best videos.