Herramientas de desarrollo de Chrome: "Tamaño" frente a "Contenido"

254

Al ver información sobre hojas de estilo en la pestaña Red de las herramientas de desarrollo de Chrome, una columna especifica tanto "tamaño" como "contenido":

Captura de pantalla de las herramientas de desarrollo con la columna Tamaño / Contenido resaltada

¿Alguien puede arrojar luz sobre la diferencia entre estos dos números? En algunas páginas, los números son cercanos y otros son diferentes en una cantidad considerable.

google-chrome web-inspector Miguel
fuente
1
Según los documentos , actualmente "de forma predeterminada, la tabla de solicitudes muestra recursos con filas pequeñas; haga clic en el botón Usar filas de solicitud grandes para aumentar el tamaño de cada fila". Esto también mostraría Contenido en la columna Tamaño.
Vadzim

Respuestas:

324

"Tamaño" es el número de bytes en el cable, y "contenido" es el tamaño real del recurso. Varias cosas pueden hacerlos diferentes, incluyendo:

  • Ser servido desde caché (pequeño o 0 "tamaño")
  • Encabezados de respuesta, incluidas las cookies ("tamaño" mayor que "contenido")
  • Redirecciones o solicitudes de autenticación
  • Compresión gzip ("tamaño" menor que "contenido", generalmente)

De los documentos :

El tamaño es el tamaño combinado de los encabezados de respuesta (generalmente unos pocos cientos de bytes) más el cuerpo de respuesta, tal como lo entrega el servidor. El contenido es el tamaño del contenido decodificado del recurso. Si el recurso se cargó desde la memoria caché del navegador en lugar de hacerlo a través de la red, este campo contendrá el texto (de la memoria caché).

Mark Brackett
fuente
2
@NiCkNewman Sí El tamaño es el tamaño real de los datos (no el ancho de banda por cierto) a través del cable (encabezados + contenido combinados). El contenido es el tamaño del contenido inflado y sin comprimir (p. Ej., Si se gziped) solamente (¡encabezados excluidos!).
Israel
3
Pregunta tonta, pero ¿estamos usando 1000 KB por MB aquí, o 1024?
Buttle Butkus
2
@ButtleButkus: Chrome, Firefox e IE / Edge utilizan el formato JEDEC desactualizado, donde un kilobyte es 1024 bytes y se escribe como KB. Sería mejor si lo informaran en formato ISO (base 10) o lo escribieran como KiB / MiB.
okdewit
1
Estoy usando Chrome versión 60.0.3112.113 (versión oficial) (64 bits) en Mac y acabo de encontrar esta misma pregunta. Las capturas de pantalla en esta pregunta son la única forma en que pude determinar cuál es la diferencia entre los números grises y negros. La versión actual de Chrome que estoy usando no parece mostrar el subtítulo "Contenido". La columna solo dice "Tamaño". ¿Hay algún lugar en los documentos o en Chrome que explique que el número gris es "Contenido". No puedo encontrarlo por ninguna parte.
flyingL123
1
Solo una nota de que en las nuevas versiones de Chrome, el número gris no se muestra de forma predeterminada, debe hacer clic en el botón 'Usar filas de solicitud grandes' en la barra "Ver" arriba
Snekse
52

Sizees el tamaño de la respuesta en sí, y Contentes el tamaño del recurso al que está accediendo.

Comparar:

caché vacío:

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

en caché:

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

c69
fuente
44
Probablemente quiere decir " Sizees el tamaño de la respuesta [...]" ("recurso" también tiene un significado diferente en términos HTTP).
Bruno
1
Lo que dijo @Bruno. Esta respuesta es simplemente incorrecta y no debería haber sido aceptada.
mhenry1384
Sí, esto es una locura: ¿UNA SOLICITUD DE 32K ?
iconoclasta
1
zomg, tuviste 1 año para editar mi respuesta. Solo un error tipográfico simple, una respuesta obvia para una pregunta trivial, fue respondida dentro de los 23 minutos posteriores a la pregunta, y fue aceptada porque ayudó al autor a comprender. No tengo idea de por qué tantas personas incluso googlean y lo votan ... tanto alboroto de la nada.
c69
77
Tiene sentido editar respuestas que son básicamente correctas, pero que podrían mejorarse. Su respuesta está más o menos en el límite, ya que probablemente quiso decir Respuesta , pero decir que la Solicitud era 32K es engañosa para cualquiera que no supiera lo suficiente como para saber que tenía que ser completamente falsa. (Esa sería la gente que hace preguntas como esta y necesita respuestas correctas sobre ellas). Además, decir algo falso no califica como un error tipográfico . Es un error de hecho, no una digitación gorda, incluso si pretendía decir algo más.
iconoclasta
12

En términos simples, el artículo de Google lo explica como Tamaño = Tamaño de transferencia y Contenido = Tamaño real ingrese la descripción de la imagen aquí

Esta es mi fórmula basada en la lectura de varios artículos sobre este tema (y estoy abierto a mejorarlo aún más con sus comentarios) Tamaño = Compresión (Contenido) + Encabezado de respuesta

Ver la imagen utilizada en este artículo

Explicación de Google

Vishwajit G
fuente