5 quick checks to make a website load faster

A slow website loses visitors before they read a single word. Here are five checks I run on almost every site, in the order I do them. None need special tools.

1. Measure before you change anything

Open Chrome DevTools, go to the Lighthouse tab and run a mobile report. Note the scores for Largest Contentful Paint (LCP) and Total Blocking Time. Without a starting number you can't tell whether a change helped.

2. Compress and resize images

Images are usually the heaviest part of a page.

• Convert photos to WebP or AVIF.
• Resize them to the size they are actually shown at. A 4000px photo in a 600px box wastes bandwidth.
• Add loading="lazy" to images below the fold:

<img src="team.webp" width="600" height="400" alt="Our team" loading="lazy">

Setting width and height also stops the page from jumping around as it loads.

3. Cut unused CSS and JavaScript

Open DevTools → Coverage and reload. It shows how much of each file is never used on that page. Remove unused libraries and load scripts that aren't needed immediately with defer:

<script src="app.js" defer></script>

4. Turn on caching and compression

• Enable gzip or Brotli on the server.
• Send Cache-Control headers so returning visitors don't re-download files that haven't changed.

5. Check your fonts

Every font weight is a separate file. Use only the weights you need, and add font-display: swap so text shows straight away instead of staying blank:

@font-face {
  font-family: "Inter";
  src: url("inter.woff2") format("woff2");
  font-display: swap;
}

Recheck

Run Lighthouse again and compare it with your first result. Most sites improve a lot from just the image and script steps.

What is the biggest speed problem you've run into? Let me know in the comments.