Generalmente, una aplicación utiliza muchas imágenes pequeñas para iconos. Una petición al servidor debe ser enviada por cada una de las imágenes, y en algunos casos, el tamaño de la imagen es menor que la cabecera de la petición en sí, que es enviada con los datos de la imagen.
Éste tipo de peticiones son muy ineficientes para el servidor. Además, Siempre que las imágenes hayan sido guardadas en caché por el cliente, una petición 304 (“no modificado”) es enviada para verificar que la imagen no haya sido modificada. Puesto que las imágenes no cambian muy a menudo, estas peticiones de verificaciones son también malas para el servidor.
Enviar muchas peticiones al servidor, para recibir imágenes y comprobar que no han cambiado hace que tu aplicación sea muy lenta. HTTP 1.1 hace que los navegadores limiten el número de conexiones HTTP a dos por dominio/puerto. Una gran cantidad de peticiones de imágenes satura las conexiones disponibles del navegador, lo cual bloquea las peticiones RPC de la aplicación. Las peticiones RPC son un trabajo más importante que tu aplicación debe realizar.
Para resolver este problema, GWT introduce el concepto de imágenes atadas (image bundle). Una imagen atada, es un conjunto de imágenes dentro de una sola imagen, con una interfaz para accesar a las imágenes individualmente. De esta forma, en vez de hacer una petición al servidor por cada imagen que necesites, la aplicación realiza solo una petición y recupera todas las imágenes.
Ya que los nombres de archivo de la composición de imágenes está basado en un hash del contenido del archivo, el nombre de archivo cambiará solamente si la imagen es cambiada. Esto significa que es seguro para los clientes guardar en caché la composición de imágenes permanentemente, lo que evita estar verificando innecesariamente si las imágenes han sufrido cambios en el servidor. Para lograr esto, la configuración del servidor necesita especificar que la composición de imágenes nunca expira. Además de la velocidad de carga de tu aplicación, usar image bundle previene el efecto “bouncy” al cargar las imágenes en el navegador.
Especificaciones
- Creando y usando image bundle
Define un image bundle y úsalo en tu aplicación - Image bundle y localización
Crea locale-sensitive image bundle para usar las capacidades de localización de GWT
0 comentarios:
Publicar un comentario en la entrada