Performance on editorial sites: how we hit 92 on Lighthouse

Editorial websites and digital magazines face a unique technical challenge: they must load a massive amount of visual content, custom fonts, and third-party scripts (ads, analytics) without ruining the user experience. In a recent project at codeX, we tackled a platform that took over 6 seconds to become interactive. Our goal was drastic: to surpass 90 points in Google Lighthouse on the mobile metric.

Here's a detailed technical roadmap we followed to achieve a solid 92, reducing the Largest Contentful Paint (LCP) and eliminating the annoying Cumulative Layout Shift - CLS page break.

1. The War Against Visual Weight: Modern Formats

70% of the initial page weight came from unoptimized images uploaded by editors. We implemented an automated pipeline on the server that intercepted each file and did the following:

• Conversion to WebP and AVIF: We reduced the weight of hero images by 45% without any perceptible loss of quality.
• srcset Attributes: We configured dynamic image delivery so that a mobile phone would never download the 1920px desktop version.
• LCP Preload: We instructed the browser to download the article's main image with ultra priority by injecting a preload tag into the head.

2. Stabilizing CLS (Cumulative Layout Shift)

There's nothing more frustrating for a reader than trying to click a link and having the page "jump" because it just loaded an ad banner. To bring CLS almost to zero, we applied a strict rule: explicit space reservation.

We ensured that all images, iframes, and ad containers had explicit width and height attributes, combined with the CSS property aspect-ratio. The browser now knows exactly how much empty space to leave on the canvas before the resource finishes loading.

3. JavaScript: Code Splitting

The browser's main thread was being blocked by heavy JavaScript bundles. The strategy here was extreme "lazy loading":

"If the user doesn't need it to see the first screenshot (above the fold) in the first second, don't load it yet."

We deferred the execution of all tracking scripts and applied code splitting so that each URL only downloaded the code necessary to function, reducing blocking time to an imperceptible level.

The real business impact

Achieving a 92 in Lighthouse isn't just a vanity metric for engineers. In the month following the rollout, the site experienced a 22% increase in session time per user and a substantial increase in organic traffic, as Google actively rewards healthy Core Web Vitals in its algorithm.

If your platform or online store is losing sales due to slow loading times and high bounce rates, our Web Development team can conduct an in-depth performance audit. Let's talk about how to accelerate your business.