¿Sabes qué son las DNS externas y cómo influyen en la velocidad de tu sitio?
¿Sabes qué son las DNS externas y cómo influyen en la velocidad de tu sitio?
La velocidad de carga de una web es un factor importantísimo de posicionamiento para Google, y cada vez más. Pero lo importante es que un sitio que cargue rápido mejora la experiencia del usuario y mejora algoritmos como la tasa de rebote, y eso también mejora tu SEO.
En este artículo vamos a ver cómo acelerar tu web usando la precarga de DNS externas.
¿Qué es la precarga de DNS?
La precarga de DNS es una característica compatible con la mayoría de los navegadores actuales. Para abreviar, es una directiva que puedes añadir a la cabecera de tu sitio para que le diga al navegador qué dominios externos precargar.
Básicamente le estás diciendo al navegador: «Necesitaré estos recursos externos en algún momento, así que recupéralos por mi y se los muestras al usuario cuando los quiera usar.»
La precarga de DNS le permite al navegador resolver nombres de dominio con su IP correspondiente, como un proceso en segundo plano, realizando una consulta de DNS a medida que el usuario ve tus páginas.
¿A qué recursos externos te refieres?
Pueden ser muchos pero los principales, que actualmente todos o casi todos cargamos en nuestros sitios suelen ser scripts de los distintos servicios de Google, fuentes (también de Google), y scripts de servicios de publicidad, rastreo, seguimiento, vídeos, cronologías de redes sociales, etc.
En la cascada (waterfall) de carga de analizadores como GTMetrix puedes verlos fácilmente…
Todos estos recursos externos ralentizan la carga de tus páginas, al tener que recuperar los scripts, fuentes, etc. desde otros dominios antes de poder aplicarlos a tu web.
¿Por qué es importante la precarga de DNS externas?
Las consultas de DNS llevan tiempo en resolverse. Si son de un servidor bien optimizado pueden durar tan poco como 10 milisegundos, pero pueden llegar a tardar entre 200 y 400 milisegundos en servidores de nombres de dominios lentos.
Una web estandar carga más de 20 recursos externos sin saberlo. Y sí, me refiero a los códigos de seguimiento de Google Analytics, el píxel de Facebook, los scripts de YouTube, los recursos de Twitter, seguimientos de Hotjar, fuentes de Google y muchos más..
Con tal cantidad de recursos externos la precarga de DNS puede acelerar la carga de dominios externos, especialmente para los usuarios de dispositivos móviles.
Así, cuando un usuario haga clic en uno de estos recursos de dominios precargados se pueden ahorrar tiempos entre 200 milisegundos y hasta más de 2 segundos, lo que marca una enorme diferencia en los tiempos de carga de las páginas.
Estos retardos se añadirán al resto de esperas que genere tu sitio para poder mostrar tus páginas a los visitantes, provocando en algunos casos malas experiencias de visualización, tiempos de carga lentos, en definitiva una navegación nada agradable ni rápida.
¡Convencido! ¿Cómo precargo DNS externas en mi WordPress?
No hay un solo modo de hacer la precarga de DNS externas, así que vamos a ver unas cuantas, luego tú eliges la que mejor se adapte a tu sitio o conocimientos, pues esto es para todos los niveles de usuario.
Pero lo primero es identificar qué recursos externos está cargando tu web desde DNS externas ¿no?
Identificar las DNS externas
Hay muchos modos de hacerlo pero nuestro favorito es usar el análisis de YSlow de GTMetrix.
Ve a la web de GTMetrix, realiza un análisis de tu web y, cuando termine, haz clic en la pestaña llamada YSlow, donde encontrarás indicadores de algo llamado Reduce DNS Lookup, que son las consultas a dominios que te sugiere reducir.
Ahí verás todos los dominios a los que tu web tiene que consultar para mostrar recursos. Verás el tuyo, por supuesto, pero también los externos.
Una estrategia obvia sería sencillamente no cargar esos recursos externos pero ¿y si los necesitas o quieres? Pues entonces vamos a aprovechar estos recursos pero bien optimizados.
Así que, una vez visto dónde identificar los dominios de cuyas DNS cargamos recursos, toca ponerse a precargarlos.
Precarga de DNS externas en la cabecera del tema
El modo más básico y simple de hacer precarga es añadir unas líneas en la cabecera del tema wordpress activo, normalmente el archivo header.php, entre las etiquetas <head> y </head> .
Así, este sería un ejemplo del código a introducir en la cabecera:
<link rel="dns-prefetch" href="//fonts.googleapis.com"> <link rel="dns-prefetch" href="//www.google-analytics.com"> <link rel="dns-prefetch" href="//www.googletagmanager.com"> <link rel="dns-prefetch" href="//otrodominioexterno.com">
Precarga de DNS externos mediante una función
Si prefieres no introducir los dominios externos en la cabecera también puedes hacerlo mediante una función en el archivo functions.php del tema activo, algo así:
/* Precarga de DNS externas */
function ayudawp_dns_prefetch() {
echo '<meta http-equiv="x-dns-prefetch-control" content="on">
<link rel="dns-prefetch" href="//fonts.googleapis.com" />
<link rel="dns-prefetch" href="//fonts.gstatic.com" />
<link rel="dns-prefetch" href="//ajax.googleapis.com" />
<link rel="dns-prefetch" href="//apis.google.com" />
<link rel="dns-prefetch" href="//google-analytics.com" />
<link rel="dns-prefetch" href="//www.google-analytics.com" />
<link rel="dns-prefetch" href="//ssl.google-analytics.com" />
<link rel="dns-prefetch" href="//youtube.com" />
<link rel="dns-prefetch" href="//api.pinterest.com" />
<link rel="dns-prefetch" href="//connect.facebook.net" />
<link rel="dns-prefetch" href="//platform.twitter.com" />
<link rel="dns-prefetch" href="//syndication.twitter.com" />
<link rel="dns-prefetch" href="//syndication.twitter.com" />
<link rel="dns-prefetch" href="//platform.instagram.com" />
<link rel="dns-prefetch" href="//s.gravatar.com" />
<link rel="dns-prefetch" href="//s0.wp.com" />
<link rel="dns-prefetch" href="//stats.wp.com" />';
}
add_action('wp_head', 'ayudawp_dns_prefetch', 0);
Como verás, hay un montón de ejemplos de las DNS externas de las que puedes estar utilizando recursos en tu web, como las fuentes de Google, analítica, YouTube, redes sociales o incluso WordPress.com si usas módulos de Jetpack.
Precarga de DNS externos con plugins gratuitos
Hay varios plugins que te permitirán hacer la precarga de DNS, estos son algunos de los más interesantes…
SG Optimizer
El plugin de optimización SG Optimizer tiene la posibilidad de hacer la precarga de DNS externas.
Solo tienes que ir a la sección de optimización del entorno, activar la característica de precarga de DNS de dominios externos ya añadir uno a uno los que estén cargando recursos en tu web, como vimos arriba.
LiteSpeed Cache
Este plugin igualmente dispone de la funcionalidad de precarga de DNS.
Flying Scripts
Bajo este curioso nombre de Scripts voladores se esconde un plugin sencillo pero eficaz para precargar cualquier script, de DNS externas o de donde quieras.
Su funcionamiento es algo diferente a los anteriores métodos, pues aquí, en vez de indicar el dominio a precargar debes apuntar el nombre del script en la caja de los ajustes del plugin.
Así que antes de rellenar la caja de «palabras clave» deberás revisar la cascada (waterfall) del análisis de GTMetrix para identificar los nombres de los scripts, y ponerlos ahí uno en cada línea.
El resultado es estupendo también.
Hay otros plugins, como Perfmatters o WP-Rocket que también incluyen este tipo de funcionalidad, pero con estos tienes más que suficiente … y son gratis.
Entérate también sobre estos temas relacionados:
¿Cómo optimizar tu sitio wordpress este 2021?
Progressive Web App (PWA): tu sitio wordpress como una aplicación para dispositivos móviles.
Google Core Web Vitals ¿qué son y cómo puedes usarlas para optimizar tu WordPress?
¿Cómo mejorar la velocidad y rendimiento en Moodle?
HTTP/3: un poco más de poder a la velocidad de carga.
 |
