FIRST-PARTY PRODUCTION WORK · 17 OCTOBER 2026

Make the homepage offer visible before JavaScript

We replaced an animated opening with a directly rendered offer and mobile booking link. In a three-run comparison per version, median mobile lab LCP changed from 7.193 to 3.101 seconds.

Project: InstaDevOps' own platform. The results below describe our implementation and verification, not a client endorsement.

Starting state and constraints

The homepage used a client component, an opacity entrance animation and a dynamically loaded delivery illustration in the opening section. The offer depended on client-side animation to become visible, and the opening did not include the new direct booking button.

We kept the Next.js static export and AWS Amplify deployment. The scope was the opening content, rendering path and call to action, with the rest of the page retained. This was a production change on 17 October 2026, not a site rebuild or a measured sales experiment.

What changed

  1. Rendered the heading, service description, price context and links in the generated HTML.
  2. Removed the hero's opacity entrance and large animated illustration from the critical opening.
  3. Placed a compact, static delivery lifecycle below the offer and kept heavier lower sections lazy-loaded.
  4. Added a direct booking link and a link to the monthly plans, then checked the offer with JavaScript blocked.
Build: generate offer and links as HTML
First render: show the offer and primary actions
Later: enhance and load heavier sections

Measured comparison

Three production-URL runs before the release and three after, using Lighthouse 12.8.2 with matching settings: mobile 412 × 823 CSS pixels, device scale factor 1.75, simulated throttling, 150 ms RTT, 1,638.4 Kbps throughput and 4× CPU slowdown. All six reports had no runtime error or run warning.

Individual lab runs, 17 October 2026
Version / runLCP (seconds)TBT (ms)CLS
before 17.358300.07674
before 26.37319.50.07674
before 37.193340.07674
after 13.37890.00000
after 21.61760.00000
after 33.10190.00000

Median LCP: 7.193 → 3.101 seconds. Median Total Blocking Time: 30 → 9 ms. Median Cumulative Layout Shift: 0.07674 → 0. These are observed lab metrics for the two versions.

Inspect the measurement extract for exact values, timestamps, settings and original report hashes. The before runs were at 02:54 UTC and the after runs at 03:01 UTC.

Deployment and verification

The change was committed as a9009062a2246ab581bcf0d3994a60f97fe4ac00. Amplify deployment 159 succeeded on 17 October 2026. We checked the production build, mobile offer visibility, links and the HTML with JavaScript blocked.

The implementation remains in our current site. This article reports the dated release comparison; subsequent homepage additions are not part of those six measurements.

What the result does and does not establish

The opening no longer needs its entrance animation to reveal the offer. The lab comparison showed a lower median LCP, but content and layout changed together, so it does not isolate a single cause.

Two after runs still exceeded 2.5 seconds. Google's LCP guidance uses a 2.5-second target at the 75th percentile of real page loads. This six-run test does not establish that field target, ranking recovery, a conversion improvement or revenue growth.

For another part of the visitor journey, read how we separated confirmed bookings from calendar clicks. A website project should verify both what visitors see and what its measurement system records.

Have a similar engineering problem?

Start with your current setup, the outcome you need and the constraints. We agree the investigation, deliverables and acceptance checks before implementation.

An enquiry starts a scoping conversation. It does not book a meeting or start a paid engagement.