La precarga de recursos o resource hints es una técnica WPO (siglas en inglés de Web Performance Optimizations u optimización de rendimiento web) que, a pesar de haber sido aplicada desde hace varios años, no se toma tanto en cuenta como la implementación de un sistema de caché o un servicio de CDN, entre otras.

El objetivo de estas técnicas es que el cliente pueda cargar la página de una manera más rápida y eficiente, en pocas palabras, se busca un efecto client-side. Esta precarga de recursos se conoce popularmente como resource hints o “sugerencias de recursos”.

¿Cómo funciona?

Para explicar su funcionamiento de una forma sencilla, esta técnica facilita que el navegador descargue recursos que no serán utilizados enseguida, pero que en el futuro podrían resultar útiles. De allí que sea denominado como “precarga”.

Si configuras de manera correcta las resource hints vas a eliminar los obstáculos al momento de cargar el website. A través de las etiquetas en el HTML de la página, se le ordena al navegador del visitante que ejecute las acciones indispensables para comenzar a cargar el contenido antes de coincidir con el elemento enlazado.

Como mencionamos al principio, la precarga de recursos viene dada por una técnica WPO que se maneja con el concepto de prebrowsing, preparar el contenido para los visitantes antes de que surja la necesidad de hacerlo. Así, el contenido es ubicable tan pronto como se necesite, porque ya se encuentra preparado y disponible en el navegador web.

Tipos de resources hints

Según las necesidades que tengamos se presentan cinco tipos de precarga, aunque no es conveniente utilizarlas todas al mismo tiempo porque se perdería su finalidad:

• • Preconnect: permite la conexión con el dominio o subdominio que se desee.
  • Prefetch DNS: es mucho más sencillo que el anterior. Señala al navegador que ejecute la solicitud de resolución DNS, lo que permite ahorrar tiempo al cargar elementos externos.
  • Prerender: con estas resource hints se realizará la carga en el navegador de la página que le señalemos en el HTML.
  • Preload: se utiliza con el objetivo de precargar elementos sin que se presenten retrasos en la carga del sitio.
  • Prefetch:es bastante útil para cargar páginas en segundo plano al culminar la carga general del portal.

Ahora que ya sabes para quéte puede servir fundamentalmente esta herramienta, sácale el máximo provecho y luego coméntanos todas tus impresiones en nuestras redes sociales.

Facebook: 786 Marketing

Instagram: @786.Marketing

Twitter: @786_Marketing