A Hugo site that loads slowly is almost always a config problem, not a Hugo problem. The generator outputs static HTML in milliseconds. What kills load time is unprocessed images, unminified assets, and render-blocking scripts you copy-pasted from somewhere.

1. Let Hugo process your images

Stop dropping full-resolution JPEGs into static/ and referencing them directly. Use Hugo’s image processing in a page bundle so it resizes and converts at build time:

{{ $img := resources.Get "hero.jpg" }}
{{ $resized := $img.Resize "1200x webp q85" }}
<img src="{{ $resized.RelPermalink }}" width="1200" loading="lazy" alt="...">

This runs once at build time, not per-request, so there’s no runtime cost. A 4000px camera photo serving as a 1200px WebP is often an 80-90% size cut with no visible quality loss.

2. Turn on minification and fingerprinting

In hugo.toml:

[minify]
  disableXML = true
[build]
  writeStats = true

[[module.mounts]]
  source = "assets/css"
  target = "assets/css"

Then pipe your CSS/JS through Hugo Pipes with fingerprinting so browsers cache aggressively and bust cache automatically on change:

{{ $css := resources.Get "css/main.css" | minify | fingerprint }}
<link rel="stylesheet" href="{{ $css.RelPermalink }}" integrity="{{ $css.Data.Integrity }}">

Build with hugo --minify on top of this for HTML/JS minification too.

3. Don’t ship a JS framework for a static blog

If your theme pulls in a full JS bundle for a mobile menu or a search box, you’re paying render-blocking cost for something three lines of vanilla JS or a <details> element could do. Check what’s actually loading:

curl -s https://yoursite.com | grep -oE '<script src="[^"]+"' 

If you see React, Alpine, or jQuery loaded for a blog with no interactivity beyond a nav toggle, that’s the first thing to cut.

4. Self-host your fonts

A @import from Google Fonts adds a DNS lookup, a connection, and a render-blocking request before text can paint. Download the font files, put them in assets/fonts/, and reference them with @font-face and font-display: swap. This alone often improves Largest Contentful Paint more than any image optimization.

5. Defer anything that isn’t above the fold

Analytics scripts, comment widgets, share buttons — none of them need to block the initial render:

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

defer over plain <script> tags for anything not required to render the visible page.

What actually moves the needle

Run Lighthouse before and after each change, not all at once — it’s the only way to know which one actually did anything.