Page Weight
Page weight describes the amount of data transferred to load a web page and its resources.
It can include HTML, CSS, JavaScript, images, fonts, video, and third-party assets.
What It Measures
Page weight is usually discussed in bytes, kilobytes, or megabytes.
A page may transfer:
- 50 KB of HTML
- 150 KB of CSS
- 500 KB of JavaScript
- 2 MB of images
- 300 KB of fonts
Together, those resources contribute to the page's network payload.
Why It Matters
More data generally takes longer to transfer, particularly on slower connections.
Heavy pages can also consume more mobile data and place additional pressure on browser resources.
But page weight is not a complete performance measurement.
A smaller page can still be slow because of server response time, dependency chains, main-thread work, or render blocking.
Common Causes of Heavy Pages
Common causes include:
- Oversized images
- Large JavaScript bundles
- Multiple web fonts
- Video loaded immediately
- Duplicate libraries
- Third-party scripts
- Unused CSS
- Resources loaded on pages that do not need them
How to Improve
Start with the largest resources and determine whether they are necessary.
Optimize images, compress appropriate responses, remove unused JavaScript, lazy-load below-the-fold media, and reduce unnecessary third-party dependencies.
Do not optimize for the smallest possible number at the expense of useful content.
The goal is an efficient page, not an empty one.