Mejore la velocidad de carga de la página con la conexión previa
Considere agregar los recursos preconnect o dns-prefetch, estos insinúa establecer principios de condiciones con los principales orígenes de terceros.
<link rel="preconnect">
Informa al navegador que su página tiene la intención de establecer una conexión con otro origen, y que desea que el proceso comience lo antes posible.El establecimiento de conexiones a menudo implica un tiempo significativo en redes lentas, particularmente cuando se trata de conexiones seguras, ya que puede involucrar búsquedas de DNS, redirecciones y varios viajes de ida y vuelta al servidor final que maneja la solicitud del usuario.
Cuidar todo esto con anticipación puede hacer que su aplicación se sienta mucho más ágil para el usuario sin afectar negativamente el uso del ancho de banda. La mayor parte del tiempo para establecer una conexión se pasa esperando, en lugar de intercambiar datos.
Informar al navegador de su intención es tan simple como agregar una etiqueta de enlace a su página:
<link rel="preconnect" href="https://example.com">
Esto le permite al navegador saber que la página tiene la intención de conectarse example.com y recuperar contenido desde allí.Tenga en cuenta que, si bien <link rel="preconnect"> es bastante barato, aún puede ocupar un valioso tiempo de CPU, especialmente en conexiones seguras. Esto es especialmente malo si la conexión no se usa en 10 segundos, ya que el navegador la cierra, desperdiciando todo ese trabajo de conexión temprana.
En general, intente usarlo <link rel="preload">, ya que es un ajuste de rendimiento más completo, pero tenga <link rel="preconnect"> en cuenta su cinturón de herramientas para casos extremos como:
<link rel="dns-prefetch"> Es otro tipo <link> relacionado con las conexiones. Esto maneja solo la búsqueda de DNS, pero tiene un soporte de navegador más amplio, por lo que puede servir como una buena alternativa. Lo usas exactamente de la misma manera:
<link rel="dns-prefetch" href="https://example.com">.
Mas sobre dns-prefetch...
Comentarios