Why does Chrome Developer Tools's Network tab show a much less size than the downloaded file size?

Question

I use Chrome (Version 72.0.3626.121 (Official Build) (64-bit) on Mac) to download http://sites.math.rutgers.edu/~ajl213/CLRS/Ch1.pdf.

The Content-Length response header is 111661. And the PDF file size is 111661. And Network Analysis Reference says:

Size. The combined size of the response headers plus the response body, as delivered by the server.

So I think that the size column value should be more than 111661. But The size column value is 310 B.

Answer 1

I'm surprised that this question doesn't get more upvotes, as it confused the s*** out of me... the answer from @steven liang is correct, the size you see by default is not the actual size, but it's not the transfer size vs. actual size as suggested here : https://superuser.com/questions/1235141/why-do-chrome-and-windows-report-a-different-file-size

... instead it's the compressed vs. uncompressed size. This doc gives a good overview of how to use the net panel : https://developer.chrome.com/docs/devtools/network/reference/#uncompressed

... of note, there's a checkbox (as of this writing in Nov. 2022) labeled "Use large request rows" which shows more data. This will cause the compressed and uncompressed sizes to be show in the size column.

Side note - if you want to gauge the size of a document, but all you see is "from cache" in the size column, then you can click the "disable cache" checkbox.

When thinking of compressed vs. uncompressed, you might think of minified JS or other assets, but this is actually referring to content compression, I'm no expert, but here's a link : https://developer.mozilla.org/en-US/docs/Web/HTTP/Compression

To see whether the asset you care about is compressed, see the "Content-encoding" header, as per : https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Encoding

For example, a JS asset I was recently inspecting had a response header of content-encoding: br ... which is a common compression algorithm used by modern HTTP servers.

Hope this helps someone out there!

Answer 2

Updated:

Don't worry. That size is not the total size.

And I got 0 bytes on Chrome 72.0.3626.119.

IE11 and Firefox can show the correct size below.

I suspect that's a bug in Chrome. You can try the same on Safari.