Echo – lazy-loading HTML5 images with data-* attributes via JavaScript

Echo  is quite handy for web developers.  On those pages that feature a lot of images, things can get slow and the server might get too much of an abuse (with more traffic thrown at it).  One way to work around this is to only load those images that are in the visible part of the screen.  Here is a demo of how it works.  Just keep scrolling down and notice how by default you have a blank.gif image shown, with a standard loading indicator and a split second later you see the actual image which was supposed to be in there.

Simple, easy, elegant – and that’s how I like it.