อีเมลสรุปของ DevTools - การแก้ไของค์ประกอบอย่างมีประสิทธิภาพ การแก้ไขข้อบกพร่องของโปรแกรมทำงานของบริการ และเฉดสีดีไซน์ Material

พอล บากาอุส
พอล บากาอุส

ใช้เมนูตามบริบทใหม่ของแผง DOM เพื่อแก้ไขโหนดอย่างมีประสิทธิภาพ แก้ไขข้อบกพร่องของโปรแกรมทำงานของบริการโดยตรงผ่านแผงทรัพยากร เลือกจากเฉดสีแบบ Material Design ทั้งหมดในแถบสี ไลบรารี JS ของ Blackbox ง่ายขึ้น

เมนูตามบริบทใหม่ที่ได้รับการปรับปรุงของแผง DOM

เมนูตามบริบทของ DOM ใหม่

เราได้วิเคราะห์การดำเนินการที่ใช้บ่อยที่สุดในแผง DOM และสรุปว่าเมนูตามบริบทเมื่อคลิกขวาควรเป็นระเบียบและเป็นระเบียบ

ตอนนี้คุณจะซ่อนหรือลบองค์ประกอบได้อย่างรวดเร็ว เรียกสถานะบางอย่าง เช่น :active หรือ :hover หรือแก้ไข HTML และหากคุณใช้แทร็กแพดและไม่ต้องการให้คลิกขวา ให้คลิกจุดเล็กๆ 3 จุดข้างองค์ประกอบที่เลือกแทน

แก้ไขข้อบกพร่องของ Service Worker ผ่านแผงทรัพยากร

โปรแกรมทำงานของบริการจะยอดเยี่ยมมากเมื่อคุณตั้งค่าแล้ว แต่พนักงานของบริการนั้นอาจอ่านเรื่องนี้แต่เนิ่นๆ ได้ยาก แต่สถานการณ์แย่ลงกว่าเดิม เนื่องจากต้องมีการแก้ไขข้อบกพร่องเมื่อออกจากเครื่องมือสำหรับนักพัฒนาเว็บและเปิด chrome://serviceworker-internals/ ในหน้าต่างเบราว์เซอร์ใหม่

Service Worker ในทรัพยากร

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

ทุกสี: เฉดสีของดีไซน์ Material ในแผงสี

เมื่อไม่กี่สัปดาห์ที่ผ่านมา เราได้เพิ่มชุดสี Material Design ลงในตัวเลือกสีเพื่อให้คุณได้รับสีหลักที่เด่นชัดในทันที ในการออกแบบหน้าแบบเต็มอย่างหลีกเลี่ยงไม่ได้ คุณต้องมีสิทธิ์เข้าถึงเฉดสีแบบ Material Design ทั้งหมด เราจึงใส่มาในตัว

หากต้องการนำเฉดสีขึ้นมา ให้กดสีหลักสีใดสีหนึ่งค้างไว้ แล้วคลิกที่สีแทน

ไลบรารี JavaScript ของ Blackbox ทำได้ง่ายขึ้นในการตั้งค่า

JavaScript Blackboxing ได้เปิดให้บริการมาระยะหนึ่งแล้ว แต่ค้นพบได้ไม่ง่ายนัก นี่เป็นคุณลักษณะที่ช่วยให้คุณสามารถแบล็กบ็อกซ์สคริปต์บนหน้าเว็บเพื่อโฟกัสที่โค้ดที่คุณเขียนเท่านั้น (และซ่อนโค้ดที่ตัดทั้งหมด)

และตอนนี้เราได้ย้ายไปไว้ที่การตั้งค่าแล้ว ลองใช้เลย:

แบล็กบ็อกซิง

ดีที่สุด

  • ไม่สามารถเข้าถึงปุ่มสลับการแสดงผลใช่ไหม เราได้ย้ายการตั้งค่าการแสดงผลไปที่เมนูหลักของเครื่องมือสำหรับนักพัฒนาเว็บ (ใน "เครื่องมือเพิ่มเติม") นอกเหนือจากผู้ต้องสงสัยทั่วไป (เช่น ตัววัด FPS) แล้ว เรายังได้ย้าย "จำลองสื่อสิ่งพิมพ์" ไปไว้ในแพลตฟอร์มดังกล่าวด้วย
  • หากเบื่อที่ต้องพิมพ์ chrome://inspect ในแถบอเนกประสงค์ ตอนนี้คุณดูตรวจสอบอุปกรณ์ได้ในเมนูหลักใหม่ในส่วน "เครื่องมือเพิ่มเติม"
  • หากคุณปิดแท็บลิ้นชักที่ปิดได้เหล่านี้โดยไม่ได้ตั้งใจ เช่น การแสดงผลหรือการค้นหา ตอนนี้คุณเปิดอีกครั้งได้ด้วยเมนูใหม่ทางด้านซ้าย

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

แล้วพบกันอีกเดือนหน้า!
Paul Bakaus และทีมเครื่องมือสำหรับนักพัฒนาเว็บ