Tu web es lenta, tus visitas caen: Cómo utilizar la caché para mejorar el rendimiento

Hace algún tiempo recibimos la llamada un tanto desesperada del CEO de una importante empresa del sector retail. El hombre estaba bastante preocupado por el escaso rendimiento que ofrecían sus portales de ventas y la alta inversión que estaba realizando en infraestructura, sin obtener buenos resultados.

Lo primero que pensamos fue en un problema con la infraestructura de servidores.

Infraestructura de sistemas
Infraestructura de sistemas

Por aquellos tiempos los sistemas basados en cloud computing no estaban tan a la orden del día como en la actualidad, por lo que estaban utilizando un conjunto de máquinas dedicadas en un conocido proveedor nacional de hosting.

Para comenzar con la investigación lo primero que hicimos fue pedirles datos de las monitorizaciones que tuvieran activas, pero para nuestra sorpresa no disponían de monitorización alguna más allá de la propia suministrada por el proveedor.

Así las cosas, decidimos acceder a las máquinas para intentar obtener algo de información que pudiera dar alguna pista de lo que estaba sucediendo.

Pero no hizo falta investigar mucho.

Entre las pruebas previas que estábamos realizando se incluía el análisis de las cabeceras HTTP, y ahí dimos con el problema:

cache-control: no-cache

No podíamos creer lo que estábamos viendo: Las webs, y los sistemas, estaban «muriendo de gloria» al no poder soportar el tráfico que estaban recibiendo ¡por culpa de tener deshabilitados los controles de caché!

Caché web
Caché web

En otra ocasión analizando la web de una renombrada compañía norteamericana del sector seguros nos percatamos de que los valores de ETAG para un mismo fichero cambiaban entre peticiones.

En efecto, tras varias pruebas pudimos observar que ¡el contenido no se cacheaba! Puestos al habla con los responsables de la compañía, nos reconocieron su preocupación por el rendimiento de sus webs, lo que mejoró tras realizar los sencillos cambios que les propusimos.

Algunos trucos

  • Cachea siempre que puedas.

Aunque sea unos pocos segundos, siempre es mejor cachear por poco que sea a no hacerlo.

  • Utiliza instrucciones de caché fuertes.

Es preferible utilizar instrucciones fuertes de control de caché de «cache-control» o «expire» a utilizar EntityTAGs, pues las cabeceras cache-control y expire son independientes de la arquitectura sobre la que se basa la web, mientras que ETAG suele construirse utilizando atributos que las hacen únicas en un servidor específico.

  • No utilices ETag (Por si no ha quedado claro).

Las EntityTag son un mecanismo utilizado por servidores y navegadores para validar si el contenido cacheado en el navegador corresponde con el contenido entregado desde el servidor.

¿cómo funciona?

Cuando descargamos un contenido de una web, el servidor indica la ETag del contenido mediante la cabecera ETag, tal que así:

HTTP/1.1 304 Not Modified
Last-Modified: Wed, 02 Oct 2013 10:00:18 GMT
Accept-Ranges: bytes
Etag: "103743356bfce1:a8a1"

Si intentamos descargar de nuevo el mismo contenido, nuestro navegador intentará validarlo pasando la cabecera If-None-Match al servidor de origen. Si los valores de ETag coinciden, el servidor retornará un código 304, o lo que es lo mismo, responderá con un tamaño de respuesta muy pequeño lo que hace posible ahorrar en ancho de banda.

Entonces, esto es bueno ¿no?

Pues sí, y no. Como ya hemos dicho es preferible cachear por poco que sea a no hacerlo, pero si ya que lo hacemos lo hacemos bien, será genial ¿qué te parece?

Ya lo hemos contado antes, el problema reside en cómo se generan estos parámetros ETag, ya que depende del sistema que sirve el contenido, pudiendo darse el caso de que un mismo cliente reciba distintos valores de ETag para el mismo contenido, debiendo realizar la descarga del mismo de nuevo, con lo que desaparece el ahorro en ancho de banda que teníamos previsto.

¿qué gano con esto?

Los diseños de las páginas son cada vez más atractivos. Por desgracia, para poder ser más atractivos hay que ser más pesados. Por ejemplo, una imagen de mayor calidad será más pesada por norma general que la misma imagen pero con una calidad mucho inferior.

Los navegadores, los proxys y sistemas de CDN utilizan elementos de caché para reducir el número de peticiones HTTP que tienen que realizar al visitar una web.

Sistemas web optimizados
¡Podemos con todo!

Por tanto, con esto conseguimos que nuestras webs carguen más rápido, que nuestro sistema no tenga que responder con el contenido completo en cada visita y ahorrar en tráfico servido.

¿Se puede pedir más por menos?