5 consejos para reducir la carga de la página enfocado a imágenes

ByLuis

Una cosa es realizar una aplicación o tener un blog y otra es que el número de visitas aumenten y tengamos que optimizar la carga de la página. Hay que intentar ganar rendimiento de cualquier forma, y una de estas formas es mediante imágenes, por eso estos consejos (que quizás sean un poco obvios) no vienen mal:

  • Evita usar imágenes complejas o grandes: cuanto más ligeras sean antes cargarán.
  • Optimiza las imágenes: existe diferentes formatos, y cada cual es conveniente en un caso. Los más usados son GIF, PNG y JPEG. JPEG y PNG tienen un valor de calidad de la imagen, reducirlo puede hacernos ganar algunos Kb y no perder en calidad.
  • Indica el tamaño de las imágenes en el HTML: así el navegador sabrá como repartir el espacio para la imagen antes de que cargue por lo que el render de la página será más rápido.
  • Precarga imágenes: aquí el autor dice un consejo un tanto peculiar, no sé si bueno o malo, pero sí interesante. Se trata de cargar imágenes grandes en páginas anteriores y asignarle el tamaño 1×1 para que no se vean y así esté cargada anteriormente. Eso sí, forzaría a que tire de caché para que no te la cargue dos veces.
  • Animaciones flash: si tienes que usar una animación no uses GIFs animados (sí, algunos te encuentras aún), usa flash, pero tampoco te pases.

Top 5 tips to decrease the load time of your websites via images

Similar Posts

|

10 razones por las que usar Silverlight

ByLuis

silverlight.pngEl título original dice ’10 razones por las que Silverlight cambiará la web’, y en mi opinión es pasarse un poco, entre otras cosas porque tampoco veo nada nuevo. Eso sí, también hay que reconocer que Silverlight parece una buena alternativa a Flash, sobre todo para los que desarrollen aplicaciones en .NET con Visual Studio. Microsoft sabe hacer las cosas y algo que gusta mucho a los jefes de proyectos es que todo esté conectado entre sí de forma fácil y rápida.

Las 10 características son las siguientes:

  • Vídeos de alta calidad: la misma tecnología que se usa para VC-1, el codec de los BluRay y HD DVD, es la que se usa para el streaming de los vídeos.
  • Multiplataforma y multinavegador: funcionará para cada plataforma y cada navegador, incluso gracias al proyecto Mono funcionará para Linux.
  • Unión de diseño gráfico y desarrollo: los desarrolladores de Visual Studio podrán crear aplicaciones para Silverlight de forma rápida, pudiendo separar el core de la aplicación de la parte gráfica.
  • Barato: tan solo es necesario disponer de IIS en nuestro servidor Windows, aunque debería funcionar en todos los servidores web. Este punto es un tanto confuso, el autor dice que es barato, pero por lo poco que he entendido, Silverlight es un plugin, como lo es el Flash Player, y su precio es gratuito. IIS no lo necesitas para nada, porque es como almacenar un archivo .swf o .png (si mal no creo). Ahora bien, ¿el precio de Visual Studio para desarrollar las aplicaciones o animaciones que funcionen en Silverlight?, mirando el precio de Flex (810€ la versión con Charting, 520€ la versión normal) y el precio de Visual Studio (1.284€ para Visual Studio 2005 Professional Edition con Suscripción MSDN Premium, aunque hay otro producto que se llama igual pero que cuesta 2.675€), no sé que pensar sobre lo barato que es.
  • Soporte a lenguajes de terceros: gracias a la nueva Dynamic Language Runtime es posible usar Ruby, Python y EcmaScript para desarrollar aplicaciones Silverlight y dejar a un lado .NET. ¿Pero esto es como cuando te dicen que puedes crear ficheros Excel, pero que tienes que tener instalado el Excel?, ¿puedes pasar de .NET y también de Visual Studio o solo de .NET?.
  • Depuración multiplataforma y multinavegador: gracias a las características que ofrece Visual Studio.
  • Mejor entorno de desarrollo del planeta: bueno, esto va en gustos, y al autor le debe gustar mucho Visual Studio.
  • Soporte a mashups: muy buena utilidad, obtenida gracias al soporte a LINQ y LINQ-to-XML por parte de Silverlight y a que los datos son accesibles mediante RSS, POX, REST y JSON.
  • Protección anticopia: evitando así que los contenidos como vídeos se puedan copiar como ocurre en los vídeos Flash como los que ofrece Youtube. Hasta que venga uno y consiga copiarlos…
  • Rapidez: habrá un gran incremento en la rapidez en las aplicaciones basadas en Ajax que usen Silverlight.

Otro punto que cuestiono es el alarde que hace el autor de que solo ocupa 2Mb., pero eso es solo el Silverlight, y según he entendido es necesario .NET, por lo que a esos 2Mb hay que añadirle los 22Mb. del framework de .NET. Demasiado si lo comparamos con el tamaño del Flash Player que es el que ejecuta las aplicaciones Flex.

Lo siento, me ha sido incapaz no dar mi opinión, que quizás parezca anti-microsoft, pero he leído en varios sitios cosas parecidas al siguiente artículo, y aunque seguro que Silverlight aporta buenas cosas a la web, tampoco hay que pasarse.

Top 10 Reasons Silverlight Will Change the Web

Vía / dzone

PHP Thumbnailer: librería para crear thumbs de imágenes

ByLuis

Si hay algo que odio a la hora de desarrollar una aplicación es tener que hacer thumbs de las imágenes, sobre todo para los perfiles: que si el thumb es cuadrado y la imagen rectangular, que si se debe recortar o meter bordes, … PHP Thumbnailer nos facilita enormemente esta tarea:

Hacer resize:

try {
     $thumb = PhpThumbFactory::create('/path/to/image.jpg');
} catch (Exception $e) {
     // error
}
$thumb->resize(100, 100);
$thumb->show();

Hacer resize y crop si es rectangular:

$thumb->adaptiveResize(175, 175);
$thumb->save('/path/to/new_image.jpg');

PHP Thumbnailer

Sphinx 0.9.9

ByLuis

Por fin ha salido la versión 0.9.9 de Sphinx, la cual llevaba en RC2 la tira de tiempo. Entre las novedades trae SphinxSE, un motor de MySQL. Además corrige más de 40 bugs. Otro aspecto importante es que Sphinx ha obtenido unos puertos oficiales de la IANA: 9312 para el API nativo y 9306 para SphinxQL.

Sphinx 0.9.9

Vía / MySQL Performance Blog

Kuler: un esquema diario de colores por Adobe

ByLuis

adobe-labs.pngSi ya hace tiempo hacíamos referencia a Daily Color Scheme, un lugar donde nos daban esquemas de colores para poder usar en nuestros diseños (que por cierto, no se actualiza demasiado), ahora nos toca hablar de Kuler una aplicación similar creada por Adobe, la cual nos permite ver esquemas de colores, crearlos, bajárnoslos y modificarlos.
kuler.png
Me ha gustado mucho la forma en que mediante una rueda de colores podemos crear nuestro propio esquema, permitiéndonos elegir si queremos colores análogos, monocromáticos…
Kuler
Vía / Criterion