McMaster-CAAR

A while back there was some hype around McMaster-CARR’s site style and performance. One of the things was the prefetch capability where mousing over a link would load that in the background and the webframework would load the content into the main section when clicked.

Speculation Rules API

Around the same time (kinda), the blink/webkit engine (chrome) started supporting the speculation rules API. Here you can define a set of rules for what should be preloaded and that content would load into a hidden tab which would replace the current one when clicked. Kinda similar, but not exactly single page application friendly, and not supported in other browsers like firefox and safari.

Preload into cache trick

A workaround for the browser and page replacement behavior is to just simulate a <link rel="prefetch"> link on hover or touchstart to immediately call and cache the content. Then when the link is actually clicked, the browser will just load it’s already cached content. You can see the behavior on this site with preload.js (assuming you’re not on chrome) which could be extended to content loading for web frameworks like react or angular. The downside though is that you’re not rendering anything like the speculative rules does, so there’s still the delay there, just not the network delay.