Chrome Dev Tools - "Rozmiar" vs " zawartość"

Podczas wyświetlania informacji o arkuszach stylów na karcie Sieć narzędzi deweloperskich Chrome, jedna kolumna określa zarówno "rozmiar", jak i"zawartość":

Zrzut ekranu narzędzi programistycznych z podświetloną kolumną rozmiar/Zawartość

Czy ktoś może rzucić światło na różnicę między tymi dwoma liczbami? Na niektórych stronach numery są bliskie, a na innych znacznie się różnią.

Author: Mark Amery, 2011-11-09
Source

4 answers

"Size" to liczba bajtów na przewodzie, a "content" to rzeczywisty rozmiar zasobu. Wiele rzeczy może je odróżnić, w tym:

  • serwowane z pamięci podręcznej (small or 0 "size")
  • nagłówki odpowiedzi, w tym pliki cookie (większe "rozmiar" niż "zawartość")
  • przekierowania lub żądania uwierzytelnienia
  • kompresja gzip (zwykle mniejsza "wielkość" niż "zawartość")

Z docs :

Rozmiar jest połączoną wielkością nagłówków odpowiedzi (zazwyczaj kilka 100 bajtów) plus ciało odpowiedzi dostarczone przez serwer. Zawartość to Rozmiar zdekodowanej zawartości zasobu. Jeśli zasób został załadowany z pamięci podręcznej przeglądarki, a nie przez sieć, to pole będzie zawierać tekst (z bufora).

 328
Author: Mark Brackett,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-04-22 08:53:18

Size jest wielkością samej odpowiedzi, a {[1] } jest wielkością zasobu, do którego uzyskujesz dostęp.

Porównaj:

Pusty cache:

main.js GET 200 OK .. Size: 31.72KB Content: 31.42KB

Cached:

main.js GET 304 Not modified .. Size: 146B Content: 31.42KB

 52
Author: c69,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-12-21 22:17:04

W prostych słowach artykuł Google wyjaśni to jako Rozmiar = Rozmiar transferu i zawartość = rzeczywisty rozmiar Tutaj wpisz opis obrazka

To jest moja formuła oparta na czytaniu różnych artykułów na ten temat (i jestem otwarty, aby poprawić go dalej z uwagami) Size = Compression (Content) + Response Header

Zobacz obrazek użyty w tym artykule

Wyjaśnienie przez Google

 12
Author: Vishwajit G,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-08-20 07:51:11

"Use large request rows" to show both values!

Jeśli nie widzisz drugiej wartości (zawartości), musisz kliknąć przycisk "Użyj dużych wierszy żądania" wewnątrz karty sieci Chrome:

Tutaj wpisz opis obrazka

Znalazłem to dzięki odpowiedzi na to pytanie tutaj:

Chrome Devs tools-gdzie rozmiar i zawartość?

 5
Author: Wilt,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2019-03-12 13:37:32