มีอะไรใหม่ในเครื่องมือสำหรับนักพัฒนาเว็บ (Chrome 80)

Kayce Basques
Kayce Basques

รองรับการประกาศซ้ำของ let และ class ใน Console

ตอนนี้คอนโซลรองรับการประกาศซ้ำของคำสั่ง let และ class แล้ว การประกาศซ้ำไม่ได้ เป็นปัญหาที่นักพัฒนาเว็บที่ใช้คอนโซลเพื่อทดลองใช้โค้ด JavaScript ใหม่ๆ มักจะพบเจอ

เช่น ก่อนหน้านี้เมื่อประกาศตัวแปรภายในอีกครั้งด้วย let คอนโซลจะแสดงข้อผิดพลาด

ภาพหน้าจอของ Console ใน Chrome 78 ที่แสดงว่าการประกาศตัวแปร let ซ้ำไม่สำเร็จ

ตอนนี้คอนโซลอนุญาตให้ประกาศซ้ำได้แล้ว

ภาพหน้าจอของ Console ใน Chrome 80 แสดงให้เห็นว่าการประกาศตัวแปร let ซ้ำสำเร็จ

ปัญหาใน Chromium #1004193

การแก้ไขข้อบกพร่องของ WebAssembly ที่ได้รับการปรับปรุง

เครื่องมือสำหรับนักพัฒนาเว็บเริ่มรองรับมาตรฐานการแก้ไขข้อบกพร่อง DWARF ซึ่งหมายถึงการรองรับที่เพิ่มขึ้นสำหรับ การข้ามโค้ด การตั้งค่าเบรกพอยต์ และการแก้ไข Stack Trace ในภาษาต้นฉบับภายใน เครื่องมือสำหรับนักพัฒนาเว็บ ดูเรื่องราวทั้งหมดได้ที่การแก้ไขข้อบกพร่องของ WebAssembly ที่ได้รับการปรับปรุงในเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome

ภาพหน้าจอของการแก้ไขข้อบกพร่อง WebAssembly ใหม่ที่ขับเคลื่อนโดย DWARF

การอัปเดตแผงเครือข่าย

เชนผู้เริ่มคำขอในแท็บผู้เริ่ม

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

ภาพหน้าจอของเชนผู้เริ่มคำขอในแท็บผู้เริ่ม

หลังจากบันทึกกิจกรรมเครือข่ายในแผงเครือข่ายแล้ว ให้คลิกทรัพยากร แล้วไปที่แท็บผู้เริ่มเพื่อดูห่วงโซ่ผู้เริ่มคำขอ

  • ทรัพยากรที่ตรวจสอบจะแสดงเป็นตัวหนา ในภาพหน้าจอด้านบน https://web.dev/default-627898b5.js คือทรัพยากรที่ตรวจสอบ
  • ทรัพยากรที่อยู่เหนือทรัพยากรที่ตรวจสอบคือผู้เริ่ม ในภาพหน้าจอด้านบน https://web.dev/bootstrap.js เป็นผู้เริ่มต้นของ https://web.dev/default-627898b5.js กล่าวอีกนัยหนึ่งคือ https://web.dev/bootstrap.js ทำให้เกิดคำขอเครือข่ายสำหรับ https://web.dev/default-627898b5.js
  • ทรัพยากรที่อยู่ใต้ทรัพยากรที่ตรวจสอบคือทรัพยากรที่ขึ้นต่อกัน ในภาพหน้าจอด้านบน https://web.dev/chunk-f34f99f7.js เป็นทรัพยากร Dependency ของ https://web.dev/default-627898b5.js กล่าวอีกนัยหนึ่งคือ https://web.dev/default-627898b5.js ทำให้เกิดคำขอเครือข่ายสำหรับ https://web.dev/chunk-f34f99f7.js

ปัญหาเกี่ยวกับ Chromium #842488

ไฮไลต์คำขอเครือข่ายที่เลือกในภาพรวม

หลังจากคลิกทรัพยากรเครือข่ายเพื่อตรวจสอบแล้ว ตอนนี้แผงเครือข่ายจะใส่เส้นขอบสีน้ำเงิน รอบทรัพยากรนั้นในภาพรวม ซึ่งจะช่วยให้คุณตรวจพบได้ว่าคำขอเครือข่ายเกิดขึ้นเร็วกว่าหรือช้ากว่าที่คาดไว้

ภาพหน้าจอของแผงภาพรวมที่ไฮไลต์ทรัพยากรที่ตรวจสอบ

ปัญหาใน Chromium