For sometime ago, I notice that few big design blog like SmashingMagazine, Noupe and other implement lazy loading on their image. I suppose this helps in optimizing their load time and save server resource.
Then I come to this jQuery lazyload for image, but the plugin is broke and not working for new browser. Would like to know is lazyload still recommended for optimizing website?
That depends on how many images you have and how important they are, there are many solutions to improving your performance ( you can find a presentation about the topic here) and most of them depend on how your website is organized and what are our needs.
So, if your website has a lot of small icons that are reused in many different places ( like amazon does ), you can use CSS sprites, you can use images encoded directly on the HTML, like google has been doing a lot and you can do lazy-load, so it all depends on your situation.
But going back to the lazy load plugin, look for javascript errors or things like that, if it doesn't work you can even build a lazy loader for yourself, should not be that complicated. Here's a hack that could possibly work (I did not run it, so I can't be sure):
<img lazy_loaded_src="/some_image.jpeg" class="lazy_loaded"/>
And then in JavaScript:
jQuery( "img.lazy_loaded" ).each( function () {
var image = jQuery( this );
image.attr( "src", image.attr("lazy_loaded_src") );
} );
This should have the same lazy-load behavior as long as you do it after the page has loaded.
Odd that it is broke. Maybe it's conflicting with your version of jQuery?
I use lazy load of images. It is a nice technique to use in certain situations.
