This plugin allows to defer loading of images within a section of a page.
This is done by first parsing out all
src attributes of the img tags contained, and then by registering these images to the jQuery plugin by Mika Tuupola (
http://www.appelsiini.net/projects/lazyload).
Unfortunately - as mentioned by Mika - a pure JavaScript solution does
not work anymore with modern browsers as these collect and download all image sources
before handing over control
to the JavaScript interpreter. While this is good for the overall page loading performance, there's no way to stop
this download process from within JavaScript as far as I know. So the only way to prevent images being already loaded
is to replace the original value of the
src attribute of img tags with a placeholder image, e.g. a white dot, and
remember the original image location in a html5
data-src attribute. The lazyload jQuery plugin will then take over
control when to patch in the real
src value again based on the scroll state of the viewport of the browser window.
This will then trigger the browser to download the image.
Usage
%STARLAZYLOAD%
images go in here
%ENDLAZYLOAD%
Note that you won't need to surround an %IMAGEGALLERY tag of
Foswiki:Extensions/ImageGalleryPlugin with
%START/ENDLAZYLOAD macros as ImageGalleryPlugin supports lazy loading of images automatically from version 5.2 onwards.
Installation Instructions
You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server.
Open configure, and open the "Extensions" section. Use "Find More Extensions" to get a list of available extensions. Select "Install".
If you have any problems, or if the extension isn't available in
configure, then you can still install manually from the command-line. See
http://foswiki.org/Support/ManuallyInstallingExtensions for more help.
Info