Chrome Geliştirme Araçları - "Boyut" ve "İçerik"


254

Chrome'un geliştirme araçlarının Ağ sekmesinde stil sayfaları hakkındaki bilgileri görüntülerken, bir sütun hem "boyut" hem de "içerik" belirtir:

Boyut / İçerik sütunu vurgulanmış geliştirici araçlarının ekran görüntüsü

Bu iki sayı arasındaki farka kimse ışık tutabilir mi? Bazı sayfalarda sayılar yakın, diğerleri ise önemli miktarda farklılık gösterir.


1
Dokümanlara göre , şu anda "varsayılan olarak İstekler Tablosu küçük satırlara sahip kaynakları görüntüler; her satırın boyutunu artırmak için Büyük istek satırlarını kullan düğmesini tıklayın". Bu ayrıca Boyutta İçerik sütununu da gösterir.
Vadzim

Yanıtlar:


324

"Boyut", teldeki bayt sayısıdır ve "içerik", kaynağın gerçek boyutudur. Aşağıdakiler de dahil olmak üzere bir dizi şey onları farklı kılabilir:

  • Önbellekten sunuluyor (küçük veya 0 "boyut")
  • Çerezler dahil yanıt başlıkları ("içerik" ten daha büyük "boyut")
  • Yönlendirmeler veya kimlik doğrulama istekleri
  • gzip sıkıştırması (genellikle "içerik" ten daha küçük "boyut")

Dokümanlardan :

Boyut, sunucu tarafından iletildiği şekliyle yanıt başlıklarının (genellikle birkaç yüz bayt) ve yanıt gövdesinin birleştirilmiş boyutudur. İçerik, kaynağın kodu çözülen içeriğinin boyutudur. Kaynak ağ yerine tarayıcının önbelleğinden yüklenmişse, bu alan metni (önbellekten) içerecektir.


2
@NiCkNewman Evet Boyut, kablodaki gerçek veri boyutudur (bant genişliği btw değil) (Üstbilgiler + İçerik birleştirildi). İçerik, yalnızca şişirilmiş, sıkıştırılmamış İçeriğin boyutudur (örneğin, sıkıştırılmışsa) (Üstbilgiler hariç!).
İsrail

3
Aptalca bir soru, ama burada MB başına 1000 KB mı yoksa 1024 mü kullanıyoruz?
Buttle Butkus

2
@ButtleButkus: Chrome, Firefox ve IE / Edge, bir kilobaytın 1024 bayt olduğu ve KB olarak yazıldığı eski JEDEC biçimini kullanır. ISO formatında (temel 10) rapor etmeleri veya KiB / MiB olarak yazmaları daha iyi olurdu.
okdewit

1
Mac'te Chrome Sürüm 60.0.3112.113 (Resmi Derleme) (64 bit) kullanıyorum ve aynı soruya rastladım. Bu sorudaki ekran görüntüleri, gri ve siyah sayılar arasındaki farkın ne olduğunu belirleyebilmemin tek yoludur. Kullandığım Chrome'un mevcut sürümü "İçerik" alt başlığını göstermiyor gibi görünüyor. Sütunda sadece "Boyut" yazıyor. Dokümanlar veya Chrome'da gri sayının "İçerik" olduğunu açıklayan bir yer var mı? Onu hiç bir yerde bulamıyorum.
uçanL123

1
Chrome'un yeni sürümlerinde, gri sayının varsayılan olarak gösterilmediğini, "Görünüm" çubuğundaki "Büyük istek satırlarını kullan" düğmesini
tıklamanız gerektiğini unutmayın

52

Sizeyanıtın kendisinin Contentboyutu ve erişmekte olduğunuz kaynağın boyutudur.

Karşılaştırmak:

boş önbellek:

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

önbelleğe:

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


4
Muhtemelen " yanıtın kendisinin Sizebüyüklüğüdür [...]" ("kaynak" HTTP terimlerinde de farklı bir anlama sahiptir).
Bruno

1
@ Bruno ne dedi. Bu cevap sadece yanlıştır ve kabul edilmemeliydi.
mhenry1384

Evet, bu çılgın konuşmak: Bir 32K İSTEĞİ !?
iconoclast

1
zomg, cevabımı düzenlemek için 1 yıl geçirdin. Sadece basit bir yazım hatası, önemsiz soru için açık bir cevap, soru sorulduktan sonra 23 dakika içinde cevaplandı ve kabul edildi çünkü yazarın anlamasına yardımcı oldu. Neden bu kadar çok insanın google ve hatta onu oyladığını bilmiyorum ... hiçbir şeyden çok fazla yaygara.
c69

7
Temel olarak doğru olan ancak geliştirilebilecek cevapları düzenlemek mantıklıdır. Muhtemelen beri Cevabınız, sıralama sınırda taşımaktadır anlamına söylemek Yanıtı , ama yine de söyleyerek İstek 32K tamamen yanlış olmak zorunda bilecek kadar bilmiyordum herkese yanıltıcıdır edildi. (Bu, böyle sorular soran ve onlar hakkında doğru cevaplara ihtiyaç duyan insanlar olacaktır.) Ayrıca, yanlış bir şey söylemek bir yazım hatası olarak nitelendirilmez . Başka bir şey söylemek isteseniz bile, bu bir hata değil, iğrenç bir parmak.
iconoclast


5

Her iki değeri göstermek için "Büyük istek satırları kullanın"!

İkinci değeri (içerik) görmüyorsanız, Chrome Ağı sekmesindeki "Büyük istek satırlarını kullan" düğmesini tıklamanız gerekir:

resim açıklamasını buraya girin

Bunu, bu sorunun şu cevabı sayesinde buldum:

Chrome Devs araçları - boyutu ve içeriği nerede?

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.