Prefetch资源预取是一种很好的技术，可以提高您网站上的感知页面速度并提供更好的用户体验。一旦浏览器空闲，预取就会在浏览器中发生，这意味着它不会减慢初始加载速度，而是利用空闲时间来获取和缓存以后可能有用的资源。Preload预取资源可以增加页面或经常被请求的资源的感知加载时间，同时还为诸如 webfonts 之类的资源提供主要的性能优势，因为它们将在浏览器下载、解析和设置 DOM 样式后下载。目前资源预取仅支持http://和https://链接，但资源预取不支持同源限制，因此您可以根据需要下载外部资源。
使用方法
prefetch
它的作用是提示浏览器我们需要这个资源，所以它应该在空闲时下载它并将它存储在缓存中。请记住，预取更像是一种提示，而不是对浏览器的提示，因此在某些情况下浏览器可能会忽略它（由于其他浏览器下载、用户设置、连接问题等）。
<link rel="prefetch" href="./page_data/data.json">preload
可以使用rel="preload"属性预加载资产，这不是提示，而是浏览器必须遵循的方向。与预取相比，预加载资源的唯一缺点是浏览器支持可能较低，具体取决于您何时阅读本文。
<link rel="preload" href="./important_data/data.json">使用场景
提示：preload 加载资源一般是当前页面需要的，prefetch 一般是其它页面有可能用到的资源。
preload是告诉浏览器预先请求当前页面需要的资源（关键的JS脚本，字体，主要图片等）。
prefetch应用场景稍微又些不同 —— 用户将来可能跳转到其它页面需要使用到的资源。如果 A 页面发起一个 B 页面的 prefetch 请求，这个资源获取过程和导航请求可能是同步进行的，而如果我们用 preload 的话，页面 A 离开时它会立即停止。
在 preload 和 prefetch 之间，我们对当前页面或即将跳转的页面在所需主要资源的问题有了一个解决方案。
