ไดเจสต์ของ DevTools - การจัดลำดับแท็บ, คอนโซลใน Listener เหตุการณ์แบบที่ 2 และเฟรมเวิร์ก

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

การนำทางที่ดีกว่าในแผง: คอนโซลบน #2, การจัดลำดับแท็บใหม่ และการขีดเส้นใต้ที่สวยงาม

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

แต่รับทราบ การเรียงลำดับแบบนี้เป็นส่วนหนึ่งของความทรงจำของกล้ามเนื้อและคุณจะรู้สึกเวียนศีรษะเป็นระยะเวลาหนึ่ง หรือคุณอาจไม่ชอบคอนโซลแบบเต็มหน้าจอ ไม่ต้องกังวล เราช่วยคุณได้ ตอนนี้คุณเรียงลำดับแท็บใหม่ได้โดยการลากไปในตำแหน่งต่างๆ ดังนี้

การเปลี่ยนแปลงที่ทำกับแถบแท็บจะยังคงอยู่ และใช้ได้กับทั้งแท็บเนทีฟและแท็บที่มีส่วนขยาย และโบนัสพิเศษคือเราใส่ขีดล่างแบบเคลื่อนไหวที่ราบรื่นลงไปด้วย เพราะเราเป็นอย่างนั้น

การรองรับ Listener เหตุการณ์ของเฟรมเวิร์ก

บางครั้งเหตุการณ์ที่สร้างโดยเฟรมเวิร์ก JS เช่น jQuery อาจทำให้เกิดปัญหาเมื่อใช้เครื่องมือสำหรับนักพัฒนาเว็บ เนื่องจากเฟรมเวิร์กส่วนใหญ่จะรวมเหตุการณ์ DOM เดิมไว้ใน API เหตุการณ์ที่กําหนดเอง ดังนั้นการดูที่ Listener ของเหตุการณ์จึงไม่ได้บอกอะไรมากนักเกี่ยวกับสิ่งที่เกิดขึ้น

ปิด Listener ของเฟรมเวิร์ก

แต่ด้วยตัวเลือก "Listener ของเฟรมเวิร์ก" ใหม่ในแท็บ Listener เหตุการณ์ เครื่องมือสำหรับนักพัฒนาเว็บจะรับรู้ถึงส่วนการรวมเฟรมเวิร์กและแก้ไขโดยอัตโนมัติ ตอนนี้เหตุการณ์ที่เชื่อมโยงกับเฟรมเวิร์กจะมีลักษณะและทํางานเหมือนกับเหตุการณ์แบบเนทีฟทุกประการ ซึ่งจะบอกให้คุณทราบว่ามีการเชื่อมโยงที่ใด

Listener ของเฟรมเวิร์กเปิดอยู่

รายการอื่นๆ ที่น่าสนใจ

  • เครื่องมือจัดรูปแบบออบเจ็กต์ที่กำหนดเองช่วยให้ภาษาที่แปลงแล้ว เช่น CoffeeScript จัดรูปแบบออบเจ็กต์ได้ดียิ่งขึ้นในคอนโซลเครื่องมือสำหรับนักพัฒนาเว็บ
  • ไทม์ไลน์มีกล่องโต้ตอบใหม่ที่ดูดีขึ้นในระหว่างการบันทึก ซึ่งจะแสดงสถานะ เวลา และการใช้งานบัฟเฟอร์โดยย่อ

    คำแนะนำเกี่ยวกับไทม์ไลน์
  • ในทํานองเดียวกัน แผงเครือข่ายจะแสดงเคล็ดลับที่เป็นประโยชน์เมื่อว่างเปล่า

    คำแนะนำเครือข่าย
  • ตอนนี้คุณสามารถกรองเนื้อหาแบบผสมในแผงเครือข่ายได้โดยใช้อินพุตตัวกรองและตั้งค่าเป็น mixed-content:displayed


และเช่นเคย แจ้งให้เราทราบว่าคุณคิดอย่างไรผ่าน Twitter หรือความคิดเห็นด้านล่าง และส่งข้อบกพร่องไปที่ crbug.com/new

แล้วพบกันใหม่เดือนหน้า Paul Bakaus และทีม DevTools