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

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

ประสบการณ์การแก้จุดบกพร่องเชิงมุมที่ดีขึ้น

เราจัดทำแบบสำรวจภายใน Google ซึ่งยืนยันการสังเกตที่เราได้รับจากนักพัฒนาภายนอก - คนส่วนใหญ่ต้องการเครื่องมือที่ดีกว่าในการแก้ไขข้อบกพร่องแอปของตน

จากผลลัพธ์ที่เราได้รับจากการศึกษาภายนอกและภายในเราได้ระบุประเด็นต่อไปนี้ที่ต้องให้ความสนใจมากที่สุด:

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

คุณสมบัติของ Angular DevTools

เพื่อรับมือกับความกังวลที่เหลือและให้มุมมองเชิงมุมเฉพาะบนพื้นฐานของ Chrome DevTools มีเราพัฒนา DevTools เชิงมุมในความร่วมมือกับRangle.io ทีมงานของ Rangle ได้สร้างเครื่องมือดีบักชิ้นแรกสำหรับ Angular - Auguryซึ่งให้บริการแก่ชุมชนมานานหลายปี การทำงานร่วมกันเราได้พัฒนา Angular DevTools ตั้งแต่เริ่มต้นโดยนำบทเรียนที่ได้รับจาก Augury มาใช้ใหม่

ในรุ่นปัจจุบัน Angular DevTools มุ่งเน้นไปที่:

• การแสดงโครงสร้างส่วนประกอบ
• ทำความเข้าใจเกี่ยวกับการดำเนินการตรวจจับการเปลี่ยนแปลง

นอกจากนี้ยังให้ภาพรวมของรอบการตรวจจับการเปลี่ยนแปลงช่วยให้คุณพบว่าอะไรคือปัญหาคอขวดด้านประสิทธิภาพเพื่อให้คุณสามารถมอบประสบการณ์ 60fps ให้กับผู้ใช้ของคุณได้

Angular DevTools รองรับแอปพลิเคชันที่สร้างด้วย Angular v9 ขึ้นไปโดยเปิดใช้งาน Ivy

Complete Development Toolchain

ใน Angular เราทำงานอย่างหนักเพื่อจัดหา toolchain ที่สมบูรณ์สำหรับนักพัฒนาเว็บยุคใหม่ Angular DevTools ร่วมกับ Angular CLI, บริการภาษา, เครื่องมือ PWA และส่วนประกอบต่างๆ Angular DevTools มีส่วนสำคัญที่ขาดหายไปซึ่งจะช่วยให้คุณเข้าใจโครงสร้างแอปพลิเคชันและประสิทธิภาพรันไทม์ได้ดีขึ้น

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

ขอขอบคุณเป็นพิเศษสำหรับAleksander BodurriและSumit Aroraที่ทำงานร่วมกันกับทีม Angular ใน DevTools