All posts
5 min read

Why Is My Website Slow? A Beginner's Guide to Finding Out

Slow sites lose visitors. How to measure speed properly, what Core Web Vitals mean, and the usual culprits in AI-built apps — huge images, too much JavaScript, slow database queries, waterfalls of API calls, and a server far from your users — with a fix for each.

getting starteddebugginginfrastructurebeginner

"It's slow" covers many different problems. A page that takes eight seconds to show anything, a button that takes three seconds to respond, and a layout that jumps around while loading all feel slow, and each has a different cause. The trick is to measure first, then fix the actual bottleneck.

Step 1: measure, don't guess

Lighthouse / PageSpeed Insights

Run Lighthouse in Chrome DevTools (in an incognito window, so extensions don't interfere), or paste your URL into PageSpeed Insights at pagespeed.web.dev. You get a score and, more usefully, a list of specific problems. (Browser Developer Tools for Beginners.)

Test the mobile result — it's slower and it's what Google primarily uses.

Core Web Vitals

Google's three headline measures:

Metric Measures Good
LCP — Largest Contentful Paint How long until the main content appears Under 2.5 seconds
INP — Interaction to Next Paint How quickly the page responds to clicks and taps Under 200 milliseconds
CLS — Cumulative Layout Shift How much the layout jumps while loading Under 0.1

They affect how users feel about your site, and they're a factor in search rankings. (SEO Basics for Your App.)

The Network tab

Open DevTools → Network, reload, and look at the waterfall: every request, in order, and how long each took. The longest bars and the biggest files are your suspects.

Step 2: the usual culprits

1. Huge images

The most common problem by far. A 4000-pixel, 5 MB photo displayed as a 400-pixel thumbnail.

Fix:

  • Resize images to the size they're displayed at (or use responsive images that serve different sizes to different screens).
  • Use modern formats: WebP or AVIF.
  • Add loading="lazy" to images below the fold, so they load only when scrolled to.
  • Frameworks help: Next.js's <Image> component does most of this automatically. (What Is Next.js?.)

2. Too much JavaScript

Every script must be downloaded, parsed, and run before the page becomes responsive — a big factor in poor INP on phones.

Fix:

  • Remove libraries you don't use. AI tools often add a whole library for one function.
  • Check for huge dependencies: a date library, a charting library, or an icon set imported in full.
  • Load heavy parts only when needed (code splitting — frameworks do this per page).
  • Audit third-party scripts: chat widgets, analytics, and trackers are often the heaviest things on a page.

3. Slow database queries

If the page itself arrives slowly — a long wait before anything appears, and the first request in the waterfall is slow — the server is probably waiting on the database.

Fix:

  • Add indexes for the columns you filter and sort by. A missing index is the classic cause of an app that was fast with 100 rows and crawls with 100,000. (Database Indexes.)
  • Look for N+1 queries — one query per item in a list. (The N+1 Query Problem.)
  • Don't load everything: paginate long lists. (API Pagination.)

4. Request waterfalls

The page loads, then fetches the user, then (once that finishes) fetches their projects, then each project's details. Each step waits for the previous one. In the Network tab, it looks like a staircase.

Fix: fetch independent things in parallel, fetch related data in one request, or load data on the server before sending the page.

5. Layout shift

Content jumps as images, ads, or fonts load — you go to tap a button and it moves.

Fix: give images and embeds explicit width and height (or an aspect ratio) so space is reserved; don't insert banners above existing content after load.

6. Server far from users, or too small

If your server is in the US and your users are in Australia, every request crosses the planet. And a server short on memory or CPU slows everything.

Fix:

  • Use a CDN for static files — images, scripts, stylesheets. (What Is a CDN?.)
  • Host your app and database in the same region, near most of your users. An app in one region talking to a database in another adds delay to every query.
  • Check your server's CPU and memory; upgrade if it's maxed out.

7. Cold starts

On serverless hosting, the first request after a quiet period can take seconds while a fresh instance starts. (What Is Serverless?.)

8. No caching

Browsers re-downloading the same files every visit, or the server rebuilding the same page for every request. (What Is Caching?.)

Step 3: fix the biggest thing first

Resist fixing everything at once. Take the Lighthouse report and the waterfall, find the single biggest cost, fix it, and measure again. Often one change — compressing images, adding one index — makes most of the difference.

Asking your AI tool

Give it the evidence, not just the complaint:

The home page has an LCP of 6.1s on mobile. Lighthouse flags these images [list] and 1.2 MB of unused JavaScript. The slowest request is GET /api/dashboard at 2.3s. Investigate the slow endpoint first — check its database queries for missing indexes or N+1 patterns — then fix the images.


EasySpawn runs your app and its managed database side by side in the same workspace — no cross-region hops and no cold starts — so Claude Code can profile slow queries against real data. See how it works or join the waitlist.

Related: What Is a CDN? · Database Indexes · Load Testing Your App

Keep reading