We respect your privacy.

We use strictly necessary cookies to keep you signed in and to protect against CSRF. With your permission we also use a small amount of first-party analytics to improve the product. We do not sell your data and we do not use third-party advertising trackers. See our cookie policy and privacy policy .

Crawlmind
← All learn topics

Rule page.performance.transfer-bloated

Shrink the page transfer size

page.performance.transfer-bloated is a check in Crawlmind's site audit that grades medium-impact issues of this kind. This page explains why the rule matters and the exact fix.

Impact: mediumEffort: high

Why it matters

Pages over a few MB of transferred bytes load slowly on mobile networks where most users actually browse. Google's mobile-first index ranks against the slow-3G simulated load: large transfers hurt LCP, FCP, and TBT in one shot. The cheapest gains are usually image format + bundle splitting.

The fix

Order of impact (biggest first):

**1. Modern image formats.** AVIF is ~50% smaller than JPEG; WebP is ~30%.

```html
<picture>
  <source srcset="hero.avif" type="image/avif">
  <source srcset="hero.webp" type="image/webp">
  <img src="hero.jpg" width="1200" height="630" alt="…">
</picture>
```

**2. Code-split JS** so only the route's code ships, not the whole app.

**3. Brotli + gzip at the edge**: Cloudflare/Vercel/Netlify do this automatically; self-hosted nginx needs `brotli on;`.

**4. Tree-shake unused exports**: `import { x } from "lib"` not `import * as lib from "lib"`.

**5. Audit fonts**: drop weights you don't use, subset to the characters you actually render.

Measure with Lighthouse → Performance → "Avoid enormous network payloads".

References