## Performance & Troubleshooting Product: Lazyline – Innovative Lazy-Load & LQIP WordPress Plugin URL: https://hub.jkdevstudio.com/docs/lazyline/features/performance-troubleshooting Updated: 2026-04-05 Summary: Recommended settings for Core Web Vitals, LCP optimization tips, common lazy loading issues, and how to diagnose placeholder rendering problems. ## Recommended Settings for Core Web Vitals ### LCP (Largest Contentful Paint) The single most important thing: **exclude your hero or banner image from lazy loading**. - Add the hero image ID or class to **Ignore IDs** or **Ignore Classes** in Preloader & Placeholders settings - Set **Viewport Threshold** to `200-400px` - too high preloads too many images and wastes bandwidth - Use **Native Lazy Loading** if you don't need preloaders or LQIP and want the lowest overhead
In Chrome DevTools > Lighthouse, the LCP element is identified for you. Copy its `id` or `class` and add it to the ignore list.
### CLS (Cumulative Layout Shift) Lazyline PRO automatically sets `aspect-ratio` on image wrappers based on the `width` and `height` attributes in the HTML. - Make sure your images have `width` and `height` attributes - WordPress adds these by default for media library images - LQIP placeholders fill the reserved space before the real image loads, preventing layout jumps - If you still see CLS, check that your theme isn't overriding `width`/`height` with CSS `width: 100%` without a corresponding `height: auto` ### Which LQIP Type Should I Use?

Type

File Size

Generation Speed

Visual Quality

Best For

Thumbnail

Small

Fast

High

General use

Palette

Zero (metadata only)

Fast

Low

Minimalist sites

Pixelart

Small

Fast

Medium

Creative/artistic sites

Primitives

Tiny (SVG)

Slow (browser)

High

Photography/portfolio

--- ## Troubleshooting ### Images not lazy loading - Check that the element type is enabled in **Lazy Load Elements** - Check that the post type is enabled - Check **Ignore IDs** and **Ignore Classes** for accidental exclusions - Open browser DevTools and inspect the image - look for `data-src`. If present, lazy loading is applied but not triggering. Check the Console tab for JavaScript errors.
The most common cause of lazy loading not triggering is a JavaScript conflict with another plugin. Open the Console and check for errors before anything else.
### LQIP not showing - Confirm LQIP is enabled and the correct type is selected as **Active** - Check the Dashboard LQIP table - if the active type shows "Not analyzed" or "Not generated", run the batch from **LQIP Settings > Batch Generation** - For **Primitives**: keep the browser tab open during generation - it runs client-side in your browser ### Layout shift on images - Ensure images have `width` and `height` attributes in your theme HTML - The plugin adds `aspect-ratio` to wrappers automatically but needs the original dimensions to calculate it ### Primitives not displaying on frontend - If you generated Primitives before v3.0, regenerate them - an SVG rendering fix was applied in that release - Confirm the LQIP type is set to **Primitives** in settings and saved