Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Performance

Cómo evitar las solicitudes automáticas de favicon (consejo rápido para el rendimiento en la web)

by
Difficulty:BeginnerLength:ShortLanguages:

Spanish (Español) translation by Ana Paulina Figueroa Vazquez (you can also view the original English article)

La mayoría de los navegadores web hacen una solicitud automática de favicon cada vez que cargan una página. No notarás esto si tu sitio tiene un favicon, pero puede ser bastante molesto si no es así. Afortunadamente, puedes resolver este problema con tan solo una línea de código HTML.

Problema: solicitudes automáticas de favicon

Al igual que con cualquier otra solicitud a un agente de usuario, una solicitud de favicon abre un diálogo de comunicación entre el navegador del usuario y el servidor. Esto da como resultado una solicitud HTTP más y una sobrecarga adicional de 1.5 KB, que son un desperdicio innecesario del rendimiento si no tienes un favicon, y puede ser especialmente molesto en un sitio de prueba y desarrollo cuando quieres ejecutar verificaciones del rendimiento.

Cómo evitar la solicitud automática de favicon

Puedes eliminar por completo la solicitud automática de favicon agregando la siguiente línea de código a la sección <head> de tu página HTML:

Este pequeño fragmento de código asigna un URL de datos vacío al elemento <link> del favicon, el cual especifica la ubicación del recurso externo. Este truco impide que el navegador del usuario envíe una solicitud HTTP automática para el favicon.

Verificación rápida del rendimiento

Para demostrar el problema y la solución, he creado un sitio de demostración simple con dos páginas HTML: una con la etiqueta <link> con el URL de datos vacío y otra sin ella. Usé la herramienta GTmetrix para medir el tiempo de carga de la página, el tamaño total de la página y la cantidad de solicitudes HTTP.

Estos son los resultados cuando no se elimina la solicitud automática de favicon:

Automatic favicon request sent
Dos solicitudes HTTP

Verás que tenemos dos solicitudes HTTP; una para el archivo HTML y una para el (no existente) favicon. Esto da como resultado un tamaño de página total de 1.73 KB y un tiempo de carga de página de 183 ms.

En la pestaña Recommendation (Recomendación), GTmetrix incluso nos recuerda evitar la solicitud incorrecta al archivo favicon.ico.

Cuando agregamos el fragmento de código previamente discutido, esa solicitud HTTP adicional desaparece, el tamaño de página total se vuelve mucho más pequeño (250 B en vez de 1.73 KB), la página carga un poco más rápido (169 ms en vez de 183 ms), y la advertencia Avoid bad request (Evita la solicitud incorrecta) desaparece también:

Automatic favicon request removed

Optimización simple del rendimiento

¡Y ahí lo tenemos! Un consejo muy rápido que resuelve un problema persistente con una solución simple. Este puede parecer un problema insignificante a tratar, pero estas mejoras marginales pueden hacer una gran diferencia en el rendimiento de tu sitio web.

Aprende más sobre la optimización del rendimiento de los sitios web

Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.