ใน Chrome 58 ซึ่งปัจจุบันเป็น Canary แผงไทม์ไลน์ได้เปลี่ยนชื่อเป็นแผงประสิทธิภาพ แผงโปรไฟล์ได้เปลี่ยนชื่อเป็นแผงหน่วยความจำ และฟีเจอร์โปรไฟล์ CPU ของระเบียน JavaScript ในแผงโปรไฟล์ได้ย้ายไปยังตำแหน่งที่ซ่อนไว้เพิ่มเติม
เป้าหมายในระยะยาวคือการนําเครื่องมือสร้างโปรไฟล์ CPU ของ JavaScript แบบเก่าออกและให้ทุกคนทํางานกับเวิร์กโฟลว์แบบใหม่
คู่มือการย้ายข้อมูลฉบับย่อนี้แสดงวิธีบันทึกโปรไฟล์ JS ในแผงประสิทธิภาพ และวิธีที่ UI ของแผงประสิทธิภาพแมปกับเวิร์กโฟลว์เดิมที่คุณคุ้นเคย
การเข้าถึงเครื่องมือสร้างโปรไฟล์ CPU ของ JavaScript เวอร์ชันเก่า
หากต้องการเวิร์กโฟลว์ "บันทึกโปรไฟล์ CPU ของ JavaScript" แบบเดิมที่เคยมีในแผงโปรไฟล์ คุณก็ยังเข้าไปใช้งานได้โดยทำดังนี้
- เปิดเมนูหลักของเครื่องมือสำหรับนักพัฒนาเว็บ
- เลือกเครื่องมือเพิ่มเติม > JavaScript Profiler เครื่องมือสร้างโปรไฟล์เดิมจะเปิดในแผงใหม่ที่ชื่อว่า JavaScript Profiler
วิธีบันทึกโปรไฟล์ JS
- เปิดเครื่องมือสำหรับนักพัฒนาเว็บ
คลิกแท็บประสิทธิภาพ
รูปที่ 1 แผงประสิทธิภาพ
บันทึกด้วยวิธีใดวิธีหนึ่งต่อไปนี้
- หากต้องการสร้างโปรไฟล์การโหลดหน้าเว็บ ให้คลิกบันทึกการโหลดหน้าเว็บ เครื่องมือสำหรับนักพัฒนาเว็บจะเริ่มบันทึกโดยอัตโนมัติ และจะหยุดโดยอัตโนมัติเมื่อตรวจพบว่าหน้าโหลดเสร็จแล้ว
- หากต้องการสร้างโปรไฟล์หน้าเว็บที่กำลังทำงาน ให้คลิกบันทึก ดำเนินการต่างๆ ที่คุณต้องการสร้างโปรไฟล์ จากนั้นคลิกหยุดเมื่อดำเนินการเสร็จ
วิธีการจับคู่เวิร์กโฟลว์เดิมกับแบบใหม่
จากมุมมองแผนภูมิของเวิร์กโฟลว์เดิม ภาพหน้าจอด้านล่างจะแสดงตําแหน่งของแผนภูมิภาพรวมการใช้งาน CPU (ลูกศรด้านบน) และแผนภูมิ Flame Chart (ลูกศรด้านล่าง) ในเวิร์กโฟลว์ใหม่
รูปที่ 2 การจับคู่ระหว่างแผนภูมิ Flame ในเวิร์กโฟลว์เก่า (ซ้าย) และเวิร์กโฟลว์ใหม่ (ขวา)
มุมมองหนัก (ล่างขึ้น) จะมีอยู่ในแท็บล่างขึ้นบน ดังนี้
รูปที่ 3 การจับคู่ระหว่างมุมมองด้านล่างในเวิร์กโฟลว์เก่า (ซ้าย) และเวิร์กโฟลว์ใหม่ (ขวา)
และมุมมอง ต้นไม้ (บนลง) จะมีอยู่ในแท็บ Call Tree ดังนี้
รูปที่ 4 การจับคู่ระหว่างมุมมองต้นไม้ในเวิร์กโฟลว์เดิม (ซ้าย) และเวิร์กโฟลว์ใหม่ (ขวา)