Why Your Site Feels Slow on Mobile

Most of your visitors are on phones, often mid-range hardware on average internet. A site that flies on your MacBook can feel heavy there. Google measures this feeling with three numbers called Core Web Vitals, and they decide part of your ranking.

The three numbers, in plain words

• LCP (Largest Contentful Paint): how fast the main content appears. Target: under 2.5s
• INP (Interaction to Next Paint): how fast the page reacts when tapped. Target: under 200ms
• CLS (Cumulative Layout Shift): how much things jump around while loading. Target: under 0.1

Fixing LCP: the main image

LCP is usually your hero image or heading. Serve it small, modern, and early:

<!-- Preload the hero image so it starts downloading immediately -->
<link rel="preload" as="image" href="/hero-800.webp" />

<!-- And never lazy-load the LCP image -->
<img src="/hero-800.webp" fetchpriority="high" alt="..." />

Fixing CLS: reserve the space

Layout shift happens when images or ads pop in without reserved space. Always give media explicit dimensions:

/* Reserve the aspect ratio before the image loads */
img { width: 100%; height: auto; aspect-ratio: 16 / 9; }

<!-- Or simply always set width and height attributes -->
<img src="/card.webp" width="800" height="450" alt="..." />

Fixing INP: less JavaScript

Mid-range phones parse JavaScript 3 to 5 times slower than your laptop. Ship less of it: remove unused libraries, lazy-load below-the-fold widgets, and move heavy work off the main thread. Frameworks like Next.js code-split per page automatically, which is half the battle.

Measure like your users

Test with PageSpeed Insights mobile score, not your flagship phone on office wifi. The lab numbers plus the real-user data it shows are exactly what Google uses. Green on mobile means the desktop experience takes care of itself.