¿Cómo optimizar la caché web?

La caché web es una tecnología fundamental para optimizar el rendimiento en los sitios web de la actualidad. Como cualquier tipo de caché, su función es almacenar información de manera temporal para acelerar algún proceso, siendo en este caso la carga de páginas web junto con sus elementos. De igual manera, esto también reduce la carga computacional para los servidores.

La caché web se ha vuelto prácticamente indispensable para una buena experiencia al navegar, ya que cada vez los sitios se van haciendo más grandes y pesados. Gracias a esta tecnología, los tiempos de carga pueden ser imperceptibles para los usuarios, además de reducir el consumo de sus datos móviles.

De cierta forma, esta acción de usar información temporal en vez de la más reciente (enviada de nuevo por el servidor) puede generar problemas. Debido a que se compone de archivos estáticos (como son scripts, hojas de estilo e imágenes), puede que al realizar cambios en alguno de estos recursos estos no se envíen al cliente en su forma más reciente, sino que se queda con la información antigua. A causa de esto, algo en el sitio podría dejar de funcionar o simplemente no reflejar los últimos cambios.

Hay diversas maneras de resolver estos problemas y seguir aprovechando al máximo las ventajas de esta tecnología. Hablaremos de algunas técnicas en este artículo así que, si usted es programador, se recomienda seguir leyendo.

Técnicas para optimizar la caché web

Las siguientes son algunas técnicas de Cache Busting, las cuales pueden ser implementadas de manera rápida y segura.

Modificar nombre de archivo

Consiste simplemente en modificar el nombre de archivo, de preferencia a manera de control de versiones. Tras haberlo cambiado, el navegador no puede determinar que esté en caché, de manera que se ve forzado a cargarlo desde el servidor. Por ejemplo:

Hay que tomar en cuenta que tiene que existir el archivo con ese nombre, en caso de no recurrir a la técnica de modificar .htaccess, la cual no cubriremos en este artículo. El renombramiento puede hacerse automáticamente con algún compilador de JS o CSS, evitando la labor manual.

Modificar directorio de archivo

Consiste en modificar el directorio del archivo, de preferencia a manera de control de versiones. Al ser una URL distinta, el navegador no usará lo que tenga en caché. Por ejemplo:

Hay que tomar en cuenta que tiene que existir el archivo en el directorio especificado para que funcione.

Query strings

Consiste en agregar una query string a la URL del archivo, provocando que el navegador lo interprete como un recurso completamente nuevo. Es uno de los métodos más sencillos y usado por CDNs.

No hay que olvidar hacer el cambio de versión cada vez que sea necesario o, en su defecto, asignar algún valor aleatorio o incluso una marca de tiempo (timestamp).

Un ejemplo para generar la versión de manera dinámica, por medio de PHP puro sería:

Aunque sería mejor si pudiésemos aprovechar las bondades de la caché y olvidarlas a conveniencia. Para esto, puede basarse en el siguiente ejemplo en PHP:

Nótese que lo importante es el uso de la función filemtime(“direcciónDeArchivo”), para obtener la fecha de la última modificación del archivo. De esta manera podemos asegurar que la caché sea ignorada solamente cuando un archivo tuvo cambios. Eso sí, hay que asegurarse de que sean cambios que valgan la pena, ya que cualquier pequeño cambio provocaría que se envíe el archivo más reciente.

Conclusión

Si bien la Caché Web es una tecnología capaz de reducir enormemente el tiempo de carga de los sitios, puede generar algunos dolores de cabeza al no reflejar cambios importantes en los recursos. Por esto, es importante tomar en cuenta las técnicas para ignorarla cuando sea necesario.