Seguro que mas de una vez te pasa, que accedes a un blog que usa muchas imágenes, como este habitualmente, y la carga de la página es lenta.
Esto es debido a que la página trata de cargar todas las imágenes disponibles, y esto hace que, aunque aún no vayas a verlas – haciendo scroll – no puedas visualizar bien la primera publicación hasta que no se carguen todas.
Quizás hayas visto que sitios como Google Imágenes usan un script que trabaja para evitar precisamente eso. Lo que hace ese script es ir cargando las imágenes a medida que haces scroll, de manera que puedas visualizar las primeras imágenes y solo se cargan las demás si de verdad quieres verlas.
Pues bien, la gente de Automattic, Techcrunch y Jake Goldman se pusieron manos a la obra y, resultado de su trabajo tenemos el plugin Lazy Load que consigue precisamente eso, que las imágenes se carguen a medida que el visitante haga scroll, cargando solo las necesarias que visualiza en su navegador y, en consecuencia, mejorando la experiencia de navegación en tu web, por velocidad de carga, por simple gestión eficaz de los recursos.
Además, que no tienes que configurar nada, lo instalas, lo activas y empieza a funcionar, usando jQuery.sonar para mostrar imágenes a medida que están en el foco de visualización del navegador del usuario. El resto de contenido, no obstante, se carga al completo, por si te quedaba la duda.
¿Ventajas?, pues todas, especialmente en blogs con mucho uso de imágenes, pues mejoras los tiempos de carga de página y eso Google es posible que te lo agradezca, y lo que es seguro es que tus visitantes te lo agradecerán.
Si quieres ver el efecto puedes comprobarlo en mi blog personal.
¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!
AVISO: Esta publicación es de hace 3 años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado. ¡Ah! ¿te funciona? pues entonces no he dicho nada :)
y hay manera de hacerlo con un trozo de código en functions.php?
¡Gracias por comentarlo aquí! Llevaba buscando algo así desde hacía tiempo 🙂
Y esto tendría sentido si utilizas un plugin de cache como w3 total cache?
Lo he probado y va bien, carga cuando tiene que cargar, perfecto.
Aunque he encontrado 2 problemillas (o posibles problemillas):
-En mi blog la paginación se hace plan ajax, cuando pagino de este modo no hace correctamente el cambio de imagen y deja las imágenes vacías.
-Al descargar directamente la página en bruto (wget from all the life) mantiene la imagen vacía en los IMG, y supongo esto puede ser un problema para los buscadores, que no hallarán las imágenes tan monas que colgamos 😀
Me desdigo de la segunda, he visto que se introduce un para que la imagen la lean crawlers y navegadores que no entienden de javascripts
Muy bueno Fernando, lo había visto alguna vez en una página y estaba buscándolo de hace tiempo.
Por lo que se puede ver a simple vista yo creo que si que funciona.
Muchas gracias
Otra cosa, habría posibilidad de hacer que aparecieran con algún efecto en vez de golpe, algo como suavizado, fade o así…
Gracias
muy bueno, ahi voy instalandolo….
Dado que no puedo logearme en el nuevo foro ni aún recuperando la contraseña, inserto este comentario en esta entrada. Ya se que no tiene nada que ver con su contenido pero no he encontrado ningún post que explique el cambio sufrido por el foro. Bueno.. hay uno pero solo habláis de vuestro nuevo servidor.
El caso es que me gustaría hacer dos sugerencias:
1) El buscador arroja resultados solo para el blog aunque te encuentres en el foro. Así, por ejemplo, si buscas Pagenavi sólo aparecen entradas y nada de las consultas realizadas por la gente en el foro.
2) En el formato anterior aparecía una lista con los comentarios más recientes. Ahora tal lista ya no existe. Es prácticamente imposible seguir la pista a las nuevas preguntas con el nuevo formato salvo que vayas subforo por subforo.
Un saludo.
Aunque es offtopic te comento que estoy aun con algún problema con los foros
Para acceder al foro, logueate en la web en el menu lateral derecho, y luego pinchas en la sección Foro del menu superior.
Creo que hace algunos años ya publicaste esto Fernando, por que hice las pruebas con el plugin y bueno hace lo que se indica, sin embargo en mi caso aún así generó un consumo de los recursos y dejé de utilizarlo.
Pues no lo recuerdo la verdad
Bueno, pues yo recuerdo algo parecido, lo probé justo cuando tenía problemas de consumo de recursos, y supongo que por eso no habría notado los cambios, pero ahora he instalado este plugin y aún así no noto los cambios.
PD. Creo que cometí un error, el anterior plugin se llamada "jquery lazy load"
consume recurso ?? mucho o poco ??
la verdad que andaba desde hace mucho buscando esto y no lo avía encontrado pero gracias @fernandot:disqus y a @fliberty:disqus ya lo tengo
Consume muchos o pocos recursos?, Funciona con todas las imágenes así no sean subidas por el editor y sean imágenes externas?, espero su respuesta.
El único pero es que no va con timthumb.
Lo he probado y no me funciona :S
Con las imágenes que inserto desde servidores externos me aparece el
hueco en el post, y las que inserto internamente no aparecen ni el
hueco.
Por si tiene algo que ver, he activado y desactivado WP Super Cache pero ningún cambio.
¿Alguna sugerencia?
Saludos y gracias!
Recomendadisimo!!!!!!!!!!!!!!!!
Lo he probado y funciona de perlas, sobre todo en esos sitios donde hay muchas imágenes que cargar.
Muchas gracias por el post. Realmente no sabía que lo necesitaba hasta que lo probé.
Hola,
Muy interesante, lo he probado y funciona muy bien en páginas en las que las se van visualizando las imágenes a medida que se hace scroll. Además es tan sencillo como instalarlo y punto, sin ningún tipo de configuración.
Alguien ha detectado alguna incompatibilidad o efecto (positivo o negativo) con herramientas como prettyPhoto o jcarrousel.
Un saludo!
Muchas gracias! no lo conocía pero me parece muy interesante y estoy comprobando que funciona bastante bien! Un saludo.
Fernando, por qué ya no utilizar Lazy Load en Ayudawordpress.com ??? Vi que antes sí lo utilizabas.
Incompatibilidades con otros plugins