DNS-prefetch y preconnect reducen la latencia de conexiones a orígenes externos resolviendo DNS y estableciendo conexiones TCP/SSL antes de que se necesiten.

DNS-prefetch

Resuelve DNS de dominios externos antes de que el navegador los solicite. Útil para recursos en CDNs, APIs y fuentes.

Preconnect

Además de DNS, establece la conexión TCP y el handshake TLS. Más costoso pero más efectivo. Usar solo para los orígenes más críticos (3-4 máximo).

Implementación

<link rel="dns-prefetch" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

Cuándo usar cuál

DNS-prefetch: recursos de terceros que no son críticos. Preconnect: orígenes que se usan en los primeros segundos de carga. Preconnect sin crossorigin puede filtrar datos.