Skip to main content

Brotli and Early Hints

Brotli reduces transfer size for text assets (CSS/JS/HTML). Early Hints (HTTP 103) can start preloads before the origin finishes generating HTML. Brotli is almost always worth enabling. Early Hints is worth testing if your pages have clear critical assets and you can verify there are no duplicate preloads.

Brotli

Enable Brotli in Cloudflare:

  • Cloudflare -> Speed -> Optimization -> Brotli

Verify:

curl-check-brotli.sh
curl -I -H "Accept-Encoding: br" https://example.com/style.css | grep -i content-encoding

Expected:

brotli-enabled.txt
content-encoding: br

Early Hints (103)

Enable Early Hints in Cloudflare:

  • Cloudflare -> Speed -> Optimization -> Early Hints

Verify (header examples vary):

curl-check-early-hints.sh
curl -I https://example.com/

You may see:

early-hints-example.txt
HTTP/1.1 103 Early Hints
link: </wp-content/themes/theme/style.css>; rel=preload; as=style

Common Mistakes

MistakeWhy It HurtsFix
Assuming Brotli replaces minificationDifferent layerMinify still reduces parse time and bytes
Too many preloads via Early HintsCompetes with other critical requestsKeep hints limited to truly critical assets
Duplicate preloads from multiple toolsWasted bandwidthVerify the <head> output and Network waterfall

What's Next