Usa las ETags en tu proyecto

Y no sólo porque lo diga Yahoo! sino porque te ahorrán tiempo y dinero. Harán que tu servidor sea capaz de procesar más peticiones y que estas sean más rápidas.

Últimamente y a medida que mis sitios web están ganando en visitas, estoy muy interesado en el tema de la optimización de los proyectos web y poco a poco, voy incorporando varias técnicas que incorporo en la fase final del desarrollo.Una de ellas es la de añadir ETag para los proyectos web que generan contenido dinámico.

La mayoría de los sitios web con contenido dinámico no están continuamente cambiando el contenido, sino que éste es modificado en momentos muy puntuales. Todo el tiempo entre un cambio y otro, el contenido es el mismo y sin embargo, hacemos que el servidor vuelva a generarlo y a enviarlo al servidor como si fuera completamente nuevo.

Las ETags son unos identificadores que se envían al navegador para identificar el “estado” de una página dinámica o de un archivo estático. Son fácilmente configurables en Apache para los archivos estáticos, pero pocas veces son usadas cuando el contenido es generado a partir de fuentes dinámicas.

Imaginemos el caso de este blog. Cada página es modificada únicamente cuando yo hago algún cambio desde el panel de control o cuando alguien deja/modifica un comentario. El resto del tiempo, el contenido de las páginas no varía.Podríamos por tanto identificar a cada página por su URL (p.ej.  “/2008/10/03/en-espana-se-vende-menos-que-se-compra/” ) y por la fecha en que fué actualizada. Si unimos ambas cosas, podríamos obtener un identificador único. Por ejemplo:

$etag = md5 ($_SERVER['REQUEST_URI'] . $last_modification_time);

Esa sería por lo tanto su Etag.  Y podríamos enviarla al navegador de la siguiente forma:

header("Etag: $etag");

El navegador, cada vez que pida esa página, enviará un header especial “If-None-Match” preguntando si es la misma página que ya le fué enviada la última vez. Con lo que antes de generar la página, podríamos comprobar:


if (trim($_SERVER['HTTP_IF_NONE_MATCH']) == $etag) {
header("HTTP/1.1 304 Not Modified");
exit;
}

De esta forma, informaríamos al navegador de que la página no ha cambiado y por lo tanto no tendríamos necesidad de volver a generarla ni de enviarla por la red. Así ahorraríamos tiempo de proceso en el servidor (carga) y ancho de banda, además de ofrecer una mejor experiencia al usuario.

Por supuesto esta no es una solución válida para cualquier proyecto o situación ( en algunas puede ser incluso contraproducente ), pero si que supone una mejora en una gran parte de los desarrollos. Al menos así ha sido para mí ;)

En el Zend Framework también tenemos ya una propuesta para usarlas.

Publicado por

manuel

Me dedico al desarrollo de aplicaciones. Principalmente trabajo con XHTML, CSS, Javascript, XML, JSON, PHP, MySQL, Linux/MacOS X y Flash actionscript. Intento siempre trabajar con estándares y simplificar el desarrollo y las aplicaciones finales con el objetivo de orientarlas al usuario (que sean útiles y faciliten el trabajo).

7 comentarios en “Usa las ETags en tu proyecto”

  1. Hola Wibol,

    no lo he hecho nunca pero imagino que no sería algo muy sencillo. Tendrías que crear un plugin o modificar alguno existente como el wp-cache.

    Saludos

  2. Hola Manuel,

    He leído algunas cosillas en inglés acerca de las ETags y me gustaría saber cómo puedo añadirlas a determinados archivos.

    Según las recomendaciones de Yahoo! los ETags deben aplicarse a archivos de imágenes (png, gif) javascript y css entre otros.

    Me gustaría saber cómo añadir estas etiquetas a dichos tipos de archivo.

    Gracias por tu ayuda y enhorabuena por el blog!

  3. Hola Diego,

    normalmente esa tarea la suelen realizar los servidores web (normalmente Apache).
    En Apache puedes optimizarlas con la directiva FileEtag.
    Por lo que básicamente debes enterarte de si tu servidor web las tiene configuradas o no.

    El tema que yo comentaba en el artículo es para archivos generados dinámicamente, para los cuales el servidor web no tiene forma fiable de crear una ETag.

    Saludos

    Manuel

  4. Efectivamente Josep,

    todo va a depender de cómo hagas el cambio y de cómo calcules la variable $last_modification_time. Si el cambio lo haces de forma manual, entonces tendrás que reflejarlo tú también de forma manual en esa variable.
    Si por el contrario el código fuente es también modificable desde algún tipo de interfaz, puedes hacer que se actualice automáticamente.

    Saludos

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *