Chrome Dev Tools - "Größe" vs "Inhalt"

254

Wenn Sie Informationen zu Stylesheets auf der Registerkarte "Netzwerk" der Chrome-Entwicklungstools anzeigen, gibt eine Spalte sowohl "Größe" als auch "Inhalt" an:

Screenshot von Entwicklungswerkzeugen mit hervorgehobener Spalte Größe / Inhalt

Kann jemand den Unterschied zwischen diesen beiden Zahlen beleuchten? Auf einigen Seiten sind die Zahlen nahe beieinander und auf anderen unterscheiden sie sich erheblich.

google-chrome web-inspector Mike
quelle
1
Laut Dokumenten werden derzeit "standardmäßig in der Anforderungstabelle Ressourcen mit kleinen Zeilen angezeigt; klicken Sie auf die Schaltfläche Große Anforderungszeilen verwenden, um die Größe jeder Zeile zu erhöhen". Dies würde auch den Inhalt in der Spalte Größe anzeigen.
Vadzim

Antworten:

324

"Größe" ist die Anzahl der Bytes auf dem Draht und "Inhalt" ist die tatsächliche Größe der Ressource. Eine Reihe von Dingen kann sie unterschiedlich machen, darunter:

  • Wird aus dem Cache bedient (klein oder 0 "Größe")
  • Antwortheader, einschließlich Cookies (größer "Größe" als "Inhalt")
  • Weiterleitungen oder Authentifizierungsanforderungen
  • gzip-Komprimierung (normalerweise kleiner als "Inhalt")

Aus den Dokumenten :

Größe ist die kombinierte Größe der Antwortheader (normalerweise einige hundert Bytes) plus des vom Server bereitgestellten Antwortkörpers. Inhalt ist die Größe des dekodierten Inhalts der Ressource. Wenn die Ressource nicht über das Netzwerk, sondern aus dem Cache des Browsers geladen wurde, enthält dieses Feld den Text (aus dem Cache).

Mark Brackett
quelle
2
@NiCkNewman Ja Größe ist die tatsächliche Datengröße (übrigens nicht die Bandbreite) über die Leitung (Header + Inhalt kombiniert). Inhalt ist die Größe des aufgeblasenen, nicht komprimierten Inhalts (z. B. wenn er gziped wurde) (Header ausgeschlossen!).
Israel
3
Dumme Frage, aber verwenden wir hier 1000 KB pro MB oder 1024?
Buttle Butkus
2
@ButtleButkus: Chrome, Firefox und IE / Edge verwenden alle das veraltete JEDEC-Format, bei dem ein Kilobyte 1024 Byte groß ist und als KB geschrieben wird. Es wäre besser, wenn sie es entweder im ISO-Format (Basis 10) melden oder als KiB / MiB schreiben würden.
Okdewit
1
Ich verwende Chrome Version 60.0.3112.113 (Official Build) (64-Bit) auf einem Mac und bin gerade auf dieselbe Frage gestoßen. Die Screenshots in dieser Frage sind die einzige Möglichkeit, den Unterschied zwischen den grauen und schwarzen Zahlen festzustellen. Die aktuelle Version von Chrome, die ich verwende, scheint die Unterüberschrift "Inhalt" nicht anzuzeigen. Die Spalte sagt nur "Größe". Gibt es irgendwo in den Dokumenten oder in Chrome, was erklärt, dass die graue Zahl "Inhalt" ist. Ich kann es nirgendwo finden.
FlyingL123
1
Nur ein Hinweis, dass in neuen Chromversionen die graue Zahl standardmäßig nicht angezeigt wird. Klicken Sie oben in der Leiste "Ansicht" auf die Schaltfläche "Große Anforderungszeilen verwenden"
Snekse
52

Sizeist die Größe der Antwort selbst und Contentdie Größe der Ressource, auf die Sie zugreifen.

Vergleichen Sie:

leerer Cache:

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

zwischengespeichert:

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

c69
quelle
4
Sie meinen wahrscheinlich " Sizeist die Größe der Antwort selbst [...]" ("Ressource" hat auch eine andere Bedeutung in HTTP-Begriffen).
Bruno
1
Was @Bruno gesagt hat. Diese Antwort ist einfach falsch und hätte nicht akzeptiert werden dürfen.
Mhenry1384
Ja, das ist verrücktes Gerede: eine 32K- ANFRAGE !?
Bilderstürmer
1
zomg, du hattest 1 Jahr Zeit, um meine Antwort zu bearbeiten. Nur ein einfacher Tippfehler, eine offensichtliche Antwort auf eine triviale Frage, wurde innerhalb von 23 Minuten nach dem Stellen der Frage beantwortet und akzeptiert, weil dies dem Autor das Verständnis erleichterte. Keine Ahnung, warum so viele Leute es überhaupt googeln und bewerten ... so viel Aufhebens um nichts.
c69
7
Es ist sinnvoll, Antworten zu bearbeiten, die grundsätzlich korrekt sind, aber verbessert werden könnten. Ihre Antwort ist eine Art an der Grenze, da Sie wahrscheinlich gemeint sagen Antwort , aber dennoch sagten die Anfrage war 32K ist irreführend , für alle , die nicht genug wussten zu wissen , dass es völlig falsch sein mußte. (Das wären die Leute, die solche Fragen stellen und korrekte Antworten benötigen.) Auch wenn Sie etwas Falsches sagen, gilt dies nicht als Tippfehler . Es ist ein Tatsachenfehler, kein fetter Fingersatz, selbst wenn Sie vorhatten, etwas anderes zu sagen.
Bilderstürmer
12

In einfachen Worten, Google-Artikel erklären es als Größe = Übertragungsgröße und Inhalt = tatsächliche Größe Geben Sie hier die Bildbeschreibung ein

Dies ist meine Formel, die auf dem Lesen verschiedener Artikel zu diesem Thema basiert (und ich bin offen dafür, sie mit Ihren Kommentaren weiter zu verbessern). Größe = Komprimierung (Inhalt) + Antwortheader

Siehe das in diesem Artikel verwendete Bild

Erklärung von Google

Vishwajit G.
quelle
5

"Verwenden Sie große Anforderungszeilen", um beide Werte anzuzeigen!

Wenn der zweite Wert (Inhalt) nicht angezeigt wird, müssen Sie auf der Registerkarte "Chrome Network" auf die Schaltfläche "Große Anforderungszeilen verwenden" klicken:

Geben Sie hier die Bildbeschreibung ein

Ich fand dies dank der Antwort auf diese Frage hier:

Chrome Devs-Tools - Wo sind Größe und Inhalt?

Verwelken
quelle