เครื่องมือ Chrome Dev - "ขนาด" เทียบกับ "เนื้อหา"

254

เมื่อดูข้อมูลเกี่ยวกับสไตล์ชีทในแท็บเครือข่ายของเครื่องมือ dev ของ Chrome หนึ่งคอลัมน์จะระบุทั้ง "ขนาด" และ "เนื้อหา":

สกรีนช็อตของเครื่องมือ dev พร้อมด้วยคอลัมน์ขนาด / เนื้อหาถูกเน้น

ใครสามารถแยกความแตกต่างระหว่างตัวเลขทั้งสองนี้ได้หรือไม่? ในบางหน้าตัวเลขจะใกล้เคียงกันและบางหน้าก็มีความแตกต่างกันในจำนวนที่มากพอสมควร

google-chrome web-inspector

— ไมค์
แหล่งที่มา

1

ตามเอกสารปัจจุบัน "ตามค่าเริ่มต้นตารางคำขอแสดงทรัพยากรที่มีแถวเล็ก ๆ คลิกปุ่มใช้แถวขอขนาดใหญ่เพื่อเพิ่มขนาดของแต่ละแถว" สิ่งนี้จะแสดงเนื้อหาในคอลัมน์ขนาดด้วย

— Vadzim

324

"ขนาด" คือจำนวนไบต์บนเส้นลวดและ "เนื้อหา" คือขนาดจริงของทรัพยากร มีหลายสิ่งที่สามารถทำให้พวกเขาแตกต่างกัน ได้แก่ :

กำลังแสดงผลจากแคช (ขนาดเล็กหรือ 0 "ขนาด")
ส่วนหัวการตอบสนองรวมถึงคุกกี้ ("ขนาด" ใหญ่กว่า "เนื้อหา")
เปลี่ยนเส้นทางหรือร้องขอการตรวจสอบ
การบีบอัด gzip (โดยปกติจะมี "ขนาด" เล็กกว่า "เนื้อหา")

จากเอกสาร :

ขนาดคือขนาดรวมของส่วนหัวการตอบกลับ (โดยปกติจะมีไม่กี่ร้อยไบต์) บวกส่วนเนื้อหาการตอบสนองตามที่ได้รับจากเซิร์ฟเวอร์ เนื้อหาคือขนาดของเนื้อหาที่ถอดรหัสของทรัพยากร หากทรัพยากรถูกโหลดจากแคชของเบราว์เซอร์มากกว่าผ่านเครือข่ายฟิลด์นี้จะมีข้อความ (จากแคช)

— Mark Brackett
แหล่งที่มา

2

@NiCkNewman ใช่ขนาดคือขนาดข้อมูลจริง (ไม่ใช่แบนด์วิดท์ btw) ทั่วทั้งเส้นลวด (รวมส่วนหัว + เนื้อหา) เนื้อหาคือขนาดของเนื้อหาที่ไม่มีการบีบอัดที่สูงเกินจริง (เช่นถ้าเป็น gziped) เท่านั้น (ยกเว้นส่วนหัว!)

— อิสราเอล

3

คำถามโง่ แต่เราใช้ 1,000 KB ต่อ MB ที่นี่หรือ 1024 หรือไม่

— Buttle Butkus

2

@ButtleButkus: Chrome, Firefox และ IE / Edge ทั้งหมดใช้รูปแบบ JEDEC ที่ล้าสมัยซึ่งกิโลไบต์คือ 1024 ไบต์และเขียนเป็น KB มันจะดีกว่าถ้าพวกเขารายงานว่าในรูปแบบ ISO (ฐาน 10) หรือเขียนเป็น KiB / MiB

— okdewit

1

ฉันใช้ Chrome เวอร์ชัน 60.0.3112.113 (Build ทางการ) (64 บิต) บน Mac และเพิ่งเจอคำถามเดียวกันนี้ ภาพหน้าจอในคำถามนี้เป็นวิธีเดียวที่ฉันสามารถกำหนดความแตกต่างระหว่างตัวเลขสีเทาและสีดำได้ Chrome เวอร์ชันปัจจุบันที่ฉันใช้ดูเหมือนจะไม่แสดงเนื้อหา "หัวข้อย่อย" คอลัมน์เพิ่งพูดว่า "ขนาด" มีที่ไหนบ้างในเอกสารหรือใน Chrome ที่อธิบายว่าหมายเลขสีเทาคือ "เนื้อหา" ฉันไม่พบที่ใดก็ได้

— flyingL123

1

โปรดทราบว่าใน Chrome รุ่นใหม่หมายเลขสีเทาจะไม่แสดงตามค่าเริ่มต้นคุณต้องคลิกปุ่ม 'ใช้แถวคำขอขนาดใหญ่' ในแถบ "ดู" ด้านบน

— Snekse

52

SizeคือขนาดของการตอบสนองและContentขนาดของทรัพยากรที่คุณกำลังเข้าถึง

เปรียบเทียบ:

แคชเปล่า:

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

เก็บไว้:

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

— c69
แหล่งที่มา

4

คุณอาจหมายถึง " Sizeเป็นขนาดของการตอบสนองตัวเอง [... ]" ("ทรัพยากร" นอกจากนี้ยังมีความหมายที่แตกต่างกันในเงื่อนไข HTTP)

— บรูโน่

1

@Bruno พูดอะไร คำตอบนี้ผิดและไม่ควรได้รับการยอมรับ

— mhenry1384

ใช่นี่คือการพูดคุยที่บ้าคลั่ง: คำขอ 32K !

— iconoclast

1

zomg คุณมีเวลา 1 ปีในการแก้ไขคำตอบของฉัน เพียงแค่พิมพ์ผิดง่าย ๆ คำตอบที่ชัดเจนสำหรับคำถามเล็กน้อยได้รับคำตอบภายใน 23 นาทีหลังจากถามคำถามและยอมรับเพราะช่วยให้ผู้เขียนเข้าใจ ไม่มีความคิดว่าทำไมคนจำนวนมากถึง google และ upvote มัน ... ไม่ต้องกังวลอะไรมากมาย

— c69

7

มันเหมาะสมที่จะแก้ไขคำตอบที่ถูกต้องโดยทั่วไป แต่สามารถปรับปรุงได้ คำตอบของคุณอยู่ในขอบเขตเนื่องจากคุณอาจหมายถึงการตอบสนองแต่อย่างไรก็ตามการบอกว่าคำขอคือ 32K นั้นทำให้เข้าใจผิดกับใครก็ตามที่ไม่รู้จักพอที่จะรู้ว่ามันต้องเป็นเท็จอย่างสมบูรณ์ (ซึ่งก็จะเป็นคนที่ถามคำถามเช่นนี้และต้องการคำตอบที่ถูกต้องเกี่ยวกับพวกเขา.) นอกจากนี้ยังพูดอะไรบางอย่างที่ผิดพลาดไม่ได้มีคุณสมบัติเป็นพิมพ์ผิด มันเป็นข้อผิดพลาดของความจริงไม่ใช่ไขมันนิ้วแม้ว่าคุณตั้งใจจะพูดอย่างอื่น

— iconoclast

12

กล่าวง่ายๆว่าบทความของ Google อธิบายเป็นขนาด = ขนาดการโอนและเนื้อหา = ขนาดจริง

นี่คือสูตรของฉันจากการอ่านบทความต่าง ๆ ในหัวข้อนี้ (และฉันเปิดให้ปรับปรุงต่อไปกับความคิดเห็นของคุณ) ขนาด = การบีบอัด (เนื้อหา) + ส่วนหัวการตอบสนอง

ดูภาพที่ใช้ในบทความนี้

คำอธิบายโดย Google

— Vishwajit G
แหล่งที่มา

5

"ใช้แถวคำขอขนาดใหญ่" เพื่อแสดงค่าทั้งสอง!

หากคุณไม่เห็นค่าที่สอง (เนื้อหา) คุณต้องคลิกปุ่ม "ใช้แถวคำขอขนาดใหญ่" ภายในแท็บเครือข่าย Chrome:

ป้อนคำอธิบายรูปภาพที่นี่

ฉันพบสิ่งนี้ต้องขอบคุณคำตอบสำหรับคำถามนี้ที่นี่:

เครื่องมือ Chrome Devs - ขนาดและเนื้อหาอยู่ที่ไหน

— ร่วงโรย
แหล่งที่มา