Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

In Chrome Network Tab, under the size column, what do the 2 numbers represent?

enter image description here

See above: For the first requestwhat does 82.0kb represent and what does 187kb represent?

Also, while we are at it, what do the 2 different numbers under time column represent? (the top number is usually larger but they are very similar)

like image 377
JaTo Avatar asked Nov 28 '16 18:11

JaTo


People also ask

What does network tab do in Chrome?

There are a couple of things you can do in the network tab, like the following: Find network requests by text. Find network requests by regex expression. Filter (exclude) out network requests.

How do I use network panel in Chrome?

Finding the Console/Network Tab in Google Chrome: Either click the three dots in the top right of your chrome browser to open the menu. Then, go to 'More tools > Developer Tools' and then switch to the Console Tab. Or, Press Ctrl+Shift+J (Windows / Linux) or Cmd+Opt+J (Mac).


1 Answers

Under Size, the first number is the size of the network response that contained that resource. Or "response size."

The second number is the "content size", the actual size of the resource on disk.

The "response size" could be larger than the "content size" (e.g, in your screenshot cs_0.2.js has a response size of 1.5kb, but the size on disk is 1.4kb) if the response contains metadata in the response headers.

Generally the response size will be smaller than content size, though, because of compression.


Under the Time column, the first number is "the total duration, from the start of the request to the receipt of the final byte in the response" (from here: https://developers.google.com/web/tools/chrome-devtools/network-performance/resource-loading#view-network-timing-details-for-a-specific-resource). The second number is essentially latency, the time it takes to get a response from the server that is serving the resource. If you click on a specific request in the list, you can view a detailed breakdown under the Timing tab (you can also see this information if you hover over the colored bar in the timeline).

The two numbers are often similar because (as you will see in the detailed breakdown) the bulk of the request time usually comes from latency -- time spent in "Waiting (TTFB)" (TTFB stands for "time to first byte").


You can actually disable viewing the content size and latency by pressing the button at the top that's directly to the right of "View:".

like image 128
A O Avatar answered Sep 21 '22 03:09

A O