Using lazy loading selectively when a page-speed optimization starts breaking the page

What was happening

The theme used lazy-loaded sections as part of a page-speed strategy. On the redesigned location pages, some blocks did not appear immediately, a call-to-action could flash white before the intended styles were active, and changing the loading behavior exposed spacing assumptions in the section layout.

Why the obvious solution was not enough

The goal was not to remove optimization globally. Other templates could still benefit from deferred work. The change needed to be page- or section-aware so the location experience could render predictably without throwing away the rest of the site's performance strategy.

How the solution works

1. Identify which sections are genuinely below the fold and which content must be stable on initial render.
2. Trace the lazy-load class or script responsible for hiding or delaying the section instead of compensating with extra CSS opacity rules.
3. Add a location-page exception for the affected blocks so the DOM and intended styles are available on initial load.
4. Keep the optimization enabled on templates where delayed rendering does not interfere with the customer journey.
5. Re-check section margins after changing the loading lifecycle because styles that depended on a lazy-load wrapper can reveal layout regressions once that wrapper is bypassed.
6. Test with a fresh page load at the top of the document, not only after scrolling through the page once.

What should be verified before shipping

• Hard-refresh the location page and verify important sections are visible without scrolling first.
• Check for white flashes, opacity transitions, or layout jumps before and after the CTA becomes interactive.
• Compare location pages with other templates to ensure the exception did not disable lazy loading sitewide.
• Verify desktop, tablet landscape, and mobile spacing after removing the delayed wrapper behavior.
• Run the relevant performance checks again so a visual fix does not silently reintroduce unnecessary work above the fold.

What changed

Location pages became visually stable on first render while lazy loading remained available where it was still appropriate. The fix treated performance as a page-experience decision instead of a global on/off feature.

Reusable lesson

Performance techniques are implementation tools, not goals by themselves. Scope them to the page and component lifecycle that actually benefits from them.