Una de las cosas que mas disfruto en mi coteidaneidad es cambiar el mundo. Y no como el cliché de querer cambiarlo todo, ni como la existencialista imposibilidad de controlarlo.

Me refiero a labrar pequeñas cosas que importen.

Un tema recursivo en mi pensar es cómo hacer que cada sitio propuesto sea el mejor. Porque así debería ser planteado cada vez. No como el ideal, sino como el mejor en algún detalle.

Hace algunos meses me inquieta (obsesivamente) la performance. Si bien es cierto lo que dice Jeff Atwood que el hardware es barato y los programdores caros, hay temas que no pueden reducirse a comprar fierros.

Desde aquí voy a dar un ejemplo y un aporte:

Por alguna razón la otra noche necesitaba poner un modal en una página, motivo por el cual y sin dar muchas vueltas me decidí a portar fancyzoom a jQuery. En el primer hit a google encontré que la gente de orderedlist ya lo había hecho.

El plugin no soporta cargar contenido por ajax pero funciona y pesa 4.5k comprimido. A esta altura algún lector atento dirá y con razón que generalmente no es el tamaño lo que importa. En nuestro caso el script usa 9 imágenes para mostrar las sombras haciendo un total de 16k.

La mayor cantidad de tiempo que demora una página en cargar está relacionado con el delay en los requests. No solo en la bajada del archivo, sino también en la conexión TCP (Voy a insistir en este punto porque comúnmente no es despreciable el tiempo desde el primer SYN al último ACK).

Sólo para el modal tendríamos: jQuery + modal + 9 imágenes + css. Ah, si. Estoy al tanto que en la informática existe algo llamado caché, pero que exista el caché no debería ser bandera para evitar tener muchísimo cuidado cuando hacemos Internet.

Luego de varias modificaciones para que comprima mejor y habiendo agrupado las 9 imágenes en 2, quedó pesando, el script comprimido 3.8k (ahora soporta cargar contenido por ajax!) y 5k las imágenes. Osea 57% menos con una nueva funcionalidad.

La manera de usarlo es la misma que antes:

$(document).ready(function() {
    $('a.zoom').fancyZoom();
});

Salvo que ahora si querés cargar otra página de tu dominio por ajax podés hacer:

$(document).ready(function() {
    $('a.zoom').fancyZoom({url: '/index.html'});
});

Acá les dejo el script para que lo usen, está el archivo comprimido, el original, las imágenes en png y las imágenes en gif

EDIT: Cree un repositorio en google code, lo pueden bajar actualizado de acá.

Y pueden ver una demo online

Martín Conte Mac Donell - mconte@atommica.com