浏览器原生的预解析/预渲染方案

预加载 prelink

在之前一片文章使用 prelink 优化跨域接口性能中，为了优化跨域接口的调用时间，文章中才用了模拟 xhr 请求的方式提前发送请求建立连接，达到了很好的效果。

但后来发现其实浏览器其实有原生方案支持这一特性。

预解析、预渲染

浏览器提供了三种方案做资源的预加载：DNS Prefetch, Prerender, Preconnect

DNS Prefetch:DNS 预解析

<link rel="dns-prefetch" href="//fonts.googleapis.com" />

Preconnect

<link href="https://cdn.domain.com" rel="preconnect" crossorigin />

在一个 HTTP 请求正式发给服务器前预先执行一些操作，这包括 DNS 解析，TLS 协商，TCP 握手；

Prerender

<link rel="prerender" href="https://www.keycdn.com" />

获取下个页面所有的资源，在空闲时渲染整个页面;