What Is Total Byte Weight? Complete Guide (2026)

Why Heavy Pages Hurt Rankings, Conversions, and Wallets

A bloated payload cascades into every other performance metric — and into your business numbers:

• Slower Core Web Vitals: More bytes mean longer download time, which delays TTFB, FCP, and LCP. LCP is a confirmed Google ranking signal, and pages that fail Core Web Vitals lose ground in competitive queries.
• Mobile is hit hardest: On a 4G connection, every megabyte costs roughly 5+ seconds. A 4 MB page can take 20+ seconds on 3G — well past the point where most visitors abandon.
• Visitor data plans: Heavy pages eat into limited mobile data. In emerging markets, a 4 MB page can cost a real fraction of a daily data budget — and visitors notice.
• Battery drain: Downloading and parsing large JavaScript bundles consumes meaningful battery on phones, especially older ones.
• CDN bills: Egress is billed per GB. Cutting median page weight in half can cut bandwidth costs in half too — especially at high-traffic scale.
• AI search visibility: AI search engines source citations primarily from pages that already rank well. A failing Total Byte Weight pulls Core Web Vitals down, which pulls rankings down, which reduces your chance of being cited in AI Overviews and similar systems.

How Total Byte Weight Is Measured

The metric is the sum of transfer size (compressed, over-the-wire bytes) of every resource the page requests during load — not the uncompressed file size on disk. The audit threshold of 1,600 KB applies to the compressed transfer total.

Worked example for a typical product page:

Resource type        Transfer size
-------------------- ------------
HTML document            45 KB
CSS bundle               68 KB
JavaScript bundle       512 KB
Hero image (WebP)       180 KB
Below-fold images       620 KB
Web fonts (woff2)       110 KB
Third-party scripts     240 KB
Video poster + preview  150 KB
-------------------- ------------
Total                 1,925 KB   (FAIL — over 1,600 KB)

On this page, the largest single category is below-fold imagery — exactly where lazy-loading and modern formats yield the biggest wins. The next-largest is JavaScript, where code-splitting and tree-shaking typically cut 30–50%.

How to Check Your Page's Byte Weight

Several tools surface Total Byte Weight, broken down by resource type and origin:

• Greadme deep scan — surfaces Total Byte Weight alongside Core Web Vitals, breaks the payload down by resource type, and pairs each oversized asset with an AI-generated fix or one-click GitHub PR.
• Greadme crawler scan — measures Total Byte Weight across every indexable page on your site, so you can pinpoint which templates (product pages, article pages, listing pages) are dragging your CWV down.
• Chrome DevTools → Network tab — disable cache, reload, and read the "transferred" total at the bottom of the panel. Sort by Size to find the biggest individual offenders.
• web.dev & Google Search Console — Search Console's Core Web Vitals report uses real-user (CrUX) data, while web.dev guidance ties byte-weight audits to LCP and TBT thresholds.

9 Proven Ways to Reduce Total Byte Weight

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

<img
  src="hero-1200.webp"
  srcset="hero-400.webp 400w,
          hero-800.webp 800w,
          hero-1200.webp 1200w,
          hero-1920.webp 1920w"
  sizes="(max-width: 600px) 400px,
         (max-width: 1024px) 800px,
         1200px"
  alt="Hero image"
  width="1200" height="630" />

<img src="below-fold.webp" loading="lazy" decoding="async"
     width="800" height="450" alt="Product detail" />

<iframe src="https://www.youtube.com/embed/..." loading="lazy"
        width="560" height="315" title="Demo video"></iframe>

// Load the heavy editor only when the user clicks "Edit"
button.addEventListener('click', async () => {
  const { mountEditor } = await import('./editor');
  mountEditor(target);
});

// webpack.config.js
module.exports = {
  performance: {
    maxAssetSize: 250 * 1024,        // 250 KB per asset
    maxEntrypointSize: 400 * 1024,   // 400 KB per entry
    hints: 'error',                  // fail the build
  },
};

@font-face {
  font-family: 'Inter';
  src: url('/fonts/inter-latin-400.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC;
}

Common Byte-Weight Problems and Fixes

Total Byte Weight Thresholds at a Glance

Use this table as a quick reference when reviewing audit results:

FAQ

What is a good Total Byte Weight?

Performance audits flag any page over 1,600 KB compressed. Best-in-class sites stay under 1,000 KB. The web median (per the HTTP Archive Web Almanac, 2024) is around 2.0 MB on mobile and 2.6 MB on desktop — meaning the typical page on the internet today already fails the audit.

Is Total Byte Weight a Google ranking factor?

Not directly — but it strongly influences metrics that are ranking factors. Heavier pages have slower LCP, FCP, and TTI, and LCP is a confirmed Core Web Vital used in ranking. Reducing byte weight is one of the most reliable ways to improve Core Web Vitals across the board.

Does the threshold apply to compressed or uncompressed size?

Compressed (transfer) size — the number of bytes that actually move across the network. A 600 KB JavaScript file served with Brotli might transfer as 150 KB, and only that 150 KB counts toward the 1,600 KB budget. This is why enabling text compression is one of the highest-leverage fixes.

Why has the web median page weight grown so much?

HTTP Archive data shows median page weight has grown from ~1.2 MB in 2017 to over 2.3 MB in 2024. The two biggest drivers are JavaScript bundle growth (frameworks, analytics, A/B testing, personalization) and higher-resolution imagery for retina displays. Most sites compensate by shipping the largest image variant to every device — which is exactly what responsive images are designed to prevent.

Which resource type usually contributes the most?

On most consumer sites: images, at 40–55% of total weight. JavaScript is usually second at 20–30%, then video, fonts, CSS, and HTML. Third-party scripts (analytics, ads, embeds) often span all of those categories and can account for 20–40% of total requests by themselves.

Does Total Byte Weight matter for AI search engines?

Indirectly, yes. AI-driven systems (Google AI Overviews, generative answer engines) preferentially cite pages that already rank well in traditional search. A bloated page hurts Core Web Vitals → hurts rankings → reduces your chance of being chosen as a citation. Lean, fast pages compete better in both surfaces.

How often should I re-measure?

Treat byte weight as a budget that drifts every release. Set a CI check using your bundler's performance.maxAssetSize for JavaScript, run a Greadme deep scan on key templates after every meaningful release, and audit third-party scripts at least quarterly. Drift is much cheaper to catch in week one than in month six.