Cómo la cabecera HTTP Vary puede ser perjudicial

Vary es una potente cabecera HTTP que juega un rol muy significativo en cómo la caché de tu web trabaja. Cuando la cabecera se configura correctamente, asegura que los visitantes a tu sitio ven el contenido correcto, sin importar que caché se aplique. Sin embargo, si la cabecera no está configurada correctamente, puede anular los beneficios incluso del mejor sistema de caché y causar un excesivo uso de recursos. En este artículo, quiero arrojar algo de luz sobre cómo la cabecera Vary afecta tu sitio web alojado en SiteGround y específicamente a nuestro sistema de caché, y así mostrarte cuál es el uso que recomendamos de Vary en tu sitio.

¿Cómo funciona la cabecera Vary?

El rol de la cabecera Vary es indicar en qué casos se debería mostrar una versión diferente de tu sitio. Si tu cabecera Vary tiene uno de los siguientes valores: User-Agent, Cookie, Referrer o incluso * (wildcard) puede reducir de forma significativa el efecto de tu sistema de caché. Esto ocurre porque estos valores indican que puede mostrarse una versión diferente de tus páginas según el tipo de navegador que uses (user-agent), la presencia de una cookie única o una URL referida o, en el peor de los casos, cuando * se usa, esto significa que a cada una de las visitas se les mostrará un contenido reciente, lo que deshabilitará totalmente nuestra caché.

Vary: User-Agent

Vamos a echar un vistazo a cómo funciona el valor más usado: User-Agent. Éste le dice a nuestro cache dinámico: “Ey, deberías almacenar diferentes cachés para diferentes SO y navegadores”. Esto se hace así, por ejemplo, para evitar que se muestre una versión del caché de escritorio a un visitante de móvil. No obstante, hay que tener en cuenta que hoy en día la mayoría de sitios no ofrecen diferentes versiones HTML en sus versiones para móviles. Es el CSS quién hace todo el trabajo duro para mostrar tu sitio web de una forma diferente a la versión de escritorio. Así que, salvo que estés usando un plugin como el WP Touch por ejemplo, o estés completamente seguro de que tienes HTMLs de salida diferentes basados en los navegadores de tus visitantes, tu web puede no debería estar enviando la cabecera Vary: User-Agent.

Sin la configuración Vary: User-Agent, nuestro sistema de caché realizará el caché de tu sitio en la primera carga y entonces mostrará la versión en caché a las siguientes peticiones a menos que actualices tu contenido o purgues la caché de forma manual. Con el User-Agent habilitado, el sistema guardará diferentes copias de cada combinación de SO y versiones de navegadores visitando tu sitio. Esto significa que tendrás una petición dinámica por cada primera persona que cargue tu sitio en un escritorio Safari, una por la primera persona que cargue desde Chrome mobile, escritorio Chrome y así sucesivamente.

Digamos que tu caché se limpia cada 100 hits. Sin Vary: User-Agent enviado por tu sitio, la web sólo tendrá una petición dinámica de cada 100. Por otro lado, con la cabecera habilitada, dependiendo del perfil de tus visitantes, tendrás 5-30 peticiones dinámicas por las mismas 100 visitas. Así que el mismo sitio usa 5-30 veces los recursos que usaría si la cabecera no estuviera configurada.

Bots maliciosos de verdad

Odiamos el tráfico malware y los bots maliciosos. Ha sido un esfuerzo continuo combatirlos de todas las maneras posibles. Menciono los bots aquí, porque si te ves espameado por ellos, la cabecera Vary: User-Agent puede determinar cómo de exitoso sería su ataque y cómo ser rastreado por bots afecta al rendimiento de tu sitio.

Puedes pensar en los bots como un navegador que hace acciones automáticas en tu sitio. Pueden recoger datos para su propio registro, buscar vulnerabilidades, intentar enviar formularios, etc. Los bots User-Agent son una simple pieza de texto añadida por sus creadores. Reputadas maquinas de rastreo como el Google bot tienen su configuración correctamente, mientras que otras intentan imitar el Bing bot, o el Google bot o incluso generar un user agent al azar.

Si ese tipo de bots empiezan a rastrear tu sitio y tienes la cabecera Vary: User-Agent, cada solicitud que hacen a tu sitio será una solicitud dinámica y se comerán tus recursos. Por el otro lado, si la cabecera no se está usando, le servirás peticiones en caché a los bots directamente desde tu caché dinámica.

Cómo ver las respuestas de tus cabeceras

Lo primero de todo, debes comprobar las cabeceras que tu sitio muestra a los visitantes. Normalmente, yo uso la pestaña de Network de FireBug en mi navegador pero hay un verificador online muy sencillo (http://www.webconfs.com/http-header-check.php) que también puedes usar. Hay múltiples valores de la cabecera Vary y user-agents es sólo uno de ellos. Si no tienes la cabecera Vary o la que tienes incluye sólo valores Accept-Encoding (eso ayuda a que las compresiones gZIP funcionen debidamente) no debes preocuparte. Sin embargo, si ves User-Agent o cualquiera de los otros valores (Cookie, Referrer o *) te recomendamos que los elimines de tu cabecera.

Cómo configurar la cabecera Vary

En general, el mejor planteamiento es entender qué parte de tu sitio web la genera y reconfigurarla. No obstante, esto puede requerir ciertas habilidades con la resolución de problemas y no es tarea fácil. Así que si estás en WordPress, puedes verificar tus cabeceras y reemplazar la respuesta sólo con lo que quieras añadiendo las siguientes líneas en tu archivo de functions.php :

Alternativamente, puedes intentar usar unas reglas .htaccess para desconfigurar la innecesaria cabecera Vary:

Eso eliminará todas las cabeceras caducadas de tu sitio y dejará sólo la que especifique el código – Accept-Encoding. Por supuesto, puedes añadir más reglas pero ¡asegúrate de que realmente las necesitas y no hay otra manera de lograr el resultado que buscas!