Performance
The levers that decide how heavy a gallery is, in the order they matter.
Galleries are the heaviest thing on most pages, because images are the heaviest thing on the web. Here's what actually moves the needle, biggest first.
1. Don't put 400 images on the page
Ajax Pagination is the single biggest win available. With it on, the page ships Show Per View items and fetches the rest when asked. The others aren't in the HTML and their files are never requested.
Everything below this is an optimisation; this is a reduction.
| Gallery size | Recommendation |
|---|---|
| Under ~30 images | No pagination needed. |
| 30–100 | Load More, 15–20 per view. |
| 100+ | Load More or Number, 12–15 per view. |
2. Serve the right file size
Image & Video Settings → Resolution picks which registered image size each tile uses, and — importantly — caps the responsive candidates the browser may choose from. It's a real ceiling, not just a default.
| Resolution | Use for |
|---|---|
| Thumbnail | Very small tiles, logo walls. |
| Medium | Most multi-column galleries. |
| Large | The default. Sensible for 2–4 column galleries. |
| Full | Only when tiles are genuinely large, or the original must be preserved. |
Full is almost never right
Full serves your original upload. A 4000×3000 camera file in a 300px tile is roughly a 6 MB download to paint a thumbnail. If a gallery feels slow, this is the first thing to check.
3. Defer what's below the fold
Lazy Load is on by default and should stay on. It stops images downloading until the visitor scrolls toward them.
Add Image Preloader if your audience is mobile-heavy — it fills the gap with a shimmer instead of an empty box.
4. Turn off what you don't use
Each module you switch off removes code from your site rather than just skipping it:
| Module off | What stops being downloaded |
|---|---|
| Lightbox | The viewer bundle and its stylesheet — on every page. |
| Ready Patterns | The library, and the outbound request to fetch its catalogue. |
| Watermark | The composite step, and any derivative files it would create. |
The plugin already only loads what a page needs: a page with no gallery loads nothing, a page whose galleries never open the lightbox doesn't download the viewer, and the Thumbnails slider runtime and the entrance animation keyframes are separate bundles requested only when used. Switching a module off is the extra step for a site that will never want it.
5. Choose a layout that doesn't measure
| Layout | Cost |
|---|---|
| Grid · Metro · Staggered | Pure CSS. Final on first paint. |
| Justified · Masonry | A small measuring pass on load and on resize. |
| Thumbnails | Its own slider runtime. |
| Perspective | Continuous animation — by far the most expensive. |
None of the first five is slow. But if a page has to be as light as it possibly can be, Grid is the cheapest thing here and Perspective is the most expensive.
6. Retina, and when to switch it off
Settings → Advanced Controls → Retina Images is on by default. It lets the browser pick a sharper file on a high-density display.
Switching it off is a genuine trade, not a placebo: the plugin stops computing the candidate list at all, which saves work per image per render as well as bandwidth. It's worth considering on metered hosting or a site whose audience is mostly on slow connections.
A watermarked gallery has no retina anyway
Responsive candidates are dropped on watermarked galleries, because a candidate the browser picked would be an unwatermarked original.
7. Caching
Two settings under Advanced Controls:
- Clear Cache Timeout — how long the plugin keeps its own cached data. 24 hours by default; leave it unless you're debugging.
- Enable Browser Caching — on by default, and should stay on. It lets repeat visitors reuse the plugin's CSS and JavaScript instead of re-downloading them.
Switching browser caching off is a troubleshooting tool for when you suspect a stale asset, not a permanent setting.
Measuring, not guessing
Settings → Advanced Controls → Debug Performance adds timing and query information to the page as HTML comments and a browser-console group — how many items were stored, how many survived filtering, how many were rendered, and how long the layout took.
It's administrator-only, and invisible to visitors
An anonymous visitor's page is byte-for-byte identical with debug on and off. It only appears for a logged-in administrator on the front end, so you can leave it on while investigating without exposing anything.
Outside the plugin, run the page through PageSpeed Insights or your browser's Network panel. Sort by size — if the top ten entries are all images from one gallery, you know which lever to pull.
A checklist before launch
- [ ] Pagination on for any gallery over ~30 images
- [ ] Resolution set to Medium or Large, not Full
- [ ] Lazy Load on
- [ ] Modules you don't use switched off
- [ ] Source images reasonably sized before upload — nothing above ~2500 px on its long edge
- [ ] Alt text filled in (not performance, but do it while you're here)
- [ ] The published page checked in a private window on a throttled connection