Page weight
The page's total size by kind of file and by host, and what could be smaller: older image formats, uncompressed text and unused bytes.
These cards are in the Design tab. Hover a row to outline its element on the page, and click it to select it, which fills the Element tab.
Page weight opens with the total, in large type, and a bar split by kind of file, so the heaviest part of the page shows at a glance. Below it, each kind (the document, scripts, styles, images, fonts, video and audio, and data from fetch and XHR) has a row with its colour, how many files, its share of the total and its size, heaviest first.
It comes from the browser's own record of this visit, and each file counts at its size as sent (compressed), whether it came over the network or from cache. Press Refresh to read the page again after more has loaded. Under the rows, how large it all is unpacked and how much compression saved; each row's tooltip says the same for its kind.
By host#
By host opens to every host the page loaded from, heaviest first. Hosts on another site than the page's own are marked third party: an analytics script, a font service, an ad. A site is the last two parts of the host name, or three under a suffix such as co.uk.
What could be smaller#
- Older image formats: the largest images over 10 kB sent as JPEG, PNG or GIF. WebP or AVIF is usually smaller at the same quality.
- Sent uncompressed: text files (the document, scripts, styles and data) sent as large as they unpack, which gzip or Brotli on the server would shrink.
- Unused bytes, measured when you press Measure: rules in the page's stylesheets whose selectors match nothing on the page as it is now, and image pixels beyond what is drawn (a 2000 pixel image shown at 500). Hover states, other widths and content added later may still use those rules, so take them as leads to check.
Timing-Allow-Origin reports no size at all; the card counts those and says the total is a minimum. The browser keeps only the first 250 files, and the card says when that limit was reached. Stylesheets from other sites cannot be read for unused rules, and script that never runs needs the browser's debugger, which Nitpique does not ask for, so it is not measured.Questions
Are sizes compressed or uncompressed?
Each file counts at its size as sent, compressed, whether it came over the network or from cache. The size unpacked is shown under the rows.
Can it measure unused JavaScript?
No. Script that never runs needs the browser's debugger, which Nitpique does not ask for. It measures unused style rules and image pixels beyond what is drawn.
Why does it say the total is a minimum?
A file from another site that does not send Timing-Allow-Origin reports no size, so the card counts those and says so.