Skip to content

Lazy Load ​

Load images as they're needed instead of all at once — on by default, and worth leaving on.

Lazy Load defers images that are below the fold until the visitor scrolls toward them. On a long gallery that's the difference between a page that downloads forty images up front and one that downloads five.

The unusual one ​

Every other module is something you switch on. Lazy Load is one you'd switch off — it ships enabled, and both halves default to on:

  1. Site-wide: Shaped Gallery → Settings → Modules → Lazy Load, on by default, no gear.
  2. Per gallery: Image & Video Settings → Lazy Load, on by default.

Switching the module off means every image in every gallery loads eagerly, whatever each gallery's own toggle says.

When would you turn it off?

Rarely, and deliberately. The honest cases are a very short above-the-fold gallery where deferring buys nothing, or a print or PDF workflow that needs every image present before it captures the page. Otherwise, leave it on.

Image Preloader ​

Right below the Lazy Load toggle sits Image Preloader (off by default). It draws a shimmer placeholder in the tile while a deferred image arrives, so the space doesn't sit empty.

It only appears — and only does anything — when something is actually being deferred. With Lazy Load off there's no gap to cover, so the placeholder would just be a permanent tint behind an image that was already there.

Preloader on long galleries

On a fast connection the shimmer flashes and is gone. On a slow one it's the difference between "the page is loading" and "the page is broken". If your audience is mobile-heavy, turn it on.

Things worth knowing ​

It covers the Thumbnails strip too. The thumbnail nav strip honours both the module and the gallery's own toggle, so turning deferred loading off really does turn it off everywhere in that gallery.

It stacks with everything else. Lazy Load decides when an image is fetched; Resolution decides which file; Retina Images decides whether the browser may pick a sharper one; Ajax Pagination decides how many exist on the page at all. They're four separate levers and they compose.

The biggest win is pagination, not lazy loading. Lazy Load stops an image downloading until it's needed; pagination stops it being on the page at all. On a 400-image gallery, do both — and do pagination first.

Where to go next ​