เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome คือชุดเครื่องมือสําหรับนักพัฒนาเว็บที่สร้างขึ้นในเบราว์เซอร์ Google Chrome โดยตรง เครื่องมือสำหรับนักพัฒนาเว็บช่วยให้คุณแก้ไขหน้าเว็บได้อย่างรวดเร็วและวินิจฉัยปัญหาได้อย่างรวดเร็ว ซึ่งช่วยให้คุณสร้างเว็บไซต์ที่ดีขึ้นและรวดเร็วขึ้นได้
เริ่มใช้งาน ดูว่ามีอะไรใหม่
ข้อมูลเชิงลึกของคอนโซลและความช่วยเหลือจาก AI ช่วยให้คุณแก้ไขข้อผิดพลาด ประสิทธิภาพ และการจัดสไตล์ JavaScript ได้อย่างมีประสิทธิภาพมากขึ้น
ดูภาพรวมประสิทธิภาพของหน้าเว็บที่ครอบคลุมและนําไปปฏิบัติได้จริง
ดูวิธีตรวจสอบทรัพยากรที่โหลดโดยหน้าเว็บและแก้ไขจากเบราว์เซอร์
วิเคราะห์และเขียนทับคำขอและคำตอบของเครือข่ายขณะดำเนินการ
ให้ Gemini ช่วยคุณวิเคราะห์และปรับปรุงการจัดรูปแบบ เครือข่าย แหล่งที่มา และประสิทธิภาพของเว็บไซต์
สํารวจกรณีการใช้งานความช่วยเหลือจาก AI ในเครื่องมือสําหรับนักพัฒนาเว็บใน Chrome และดูวิธีที่เครื่องมือนี้ช่วยสนับสนุนเวิร์กโฟลว์การแก้ไขข้อบกพร่องในด้านต่างๆ เช่น การจัดสไตล์ ประสิทธิภาพ และอื่นๆ
ทําความเข้าใจข้อความและข้อผิดพลาดในคอนโซลของเครื่องมือสําหรับนักพัฒนาเว็บ และดูวิธีแก้ไขโดยไม่ต้องคัดลอกและวาง
ดูวิธีบันทึกการติดตามประสิทธิภาพในเครื่องมือสำหรับนักพัฒนาเว็บและวิเคราะห์เพื่อระบุและแก้ไขปัญหาด้านประสิทธิภาพ
แก้ไขข้อบกพร่อง LCP และใช้ข้อมูล CrUX เพื่อดูว่าคุณกำลังแก้ไขข้อบกพร่องของประสบการณ์ที่คล้ายกับผู้ใช้หรือไม่
เจาะลึกเกี่ยวกับแคชของเบราว์เซอร์ประเภทต่างๆ รวมถึงวิธีตรวจสอบและจัดการแคชใน Chrome DevTools
พยายามตรวจสอบองค์ประกอบ แต่องค์ประกอบนั้นหายไปแล้ว ดูเหมือนว่ารหัสจะเล่นซ่อนหากับคุณ
ดูข้อมูลเกี่ยวกับฟีเจอร์ทั้งหมดในแผงประสิทธิภาพ เช่น วิธีบันทึกการติดตามประสิทธิภาพ วิธีดูและวิเคราะห์การติดตาม และอื่นๆ
ดูข้อมูลเกี่ยวกับฟีเจอร์ใหม่ของเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ เช่น การปรับเทียบการจำกัด CPU เพื่อช่วยให้คุณตัดสินใจแก้ไขข้อบกพร่องด้านประสิทธิภาพโดยอิงตามข้อมูลจากโลกแห่งความเป็นจริง
ดูข้อมูลเกี่ยวกับข้อมูลเชิงลึกเกี่ยวกับประสิทธิภาพใหม่ ซึ่งเป็นความสามารถของ Lighthouse ได้โดยตรงในแผงประสิทธิภาพของเครื่องมือสำหรับนักพัฒนาเว็บ
ดูข้อมูลเกี่ยวกับฟีเจอร์ทั้งหมดในแผงแหล่งที่มา เช่น วิธีดูและแก้ไขไฟล์ แก้ไขข้อบกพร่อง JavaScript และตั้งค่าเวิร์กスペース
เริ่มใช้งาน
Workspace ช่วยให้คุณบันทึกการเปลี่ยนแปลงที่ทำในเครื่องมือสำหรับนักพัฒนาเว็บไปยังซอร์สโค้ดที่เก็บไว้ในคอมพิวเตอร์ได้ ดูวิธีตั้งค่าพื้นที่ทํางานในโปรเจ็กต์ของคุณเอง
อ่านบทแนะนำ
ดูข้อมูลเกี่ยวกับฟีเจอร์ทั้งหมดในแผงเครือข่าย เช่น ตรวจสอบเนื้อหาการตอบกลับและคำขอ เขียนทับส่วนหัว และอื่นๆ
เริ่มใช้งาน
บทแนะนำแบบปฏิบัติจริงที่แนะนำคุณเกี่ยวกับงานทั่วไปในแผงเครือข่าย
อ่านบทแนะนำ
เรียนรู้วิธีดูและเปลี่ยนแปลง DOM ของหน้าเว็บ
เรียนรู้วิธีดูและเปลี่ยนแปลง CSS ของหน้าเว็บ
ติดตามการเปลี่ยนแปลงใน HTML, CSS และ JavaScript
บันทึกข้อความและเรียกใช้ JavaScript
ประเมินประสิทธิภาพของเว็บไซต์
ค้นหาปัญหาเกี่ยวกับหน่วยความจำที่ส่งผลต่อประสิทธิภาพของหน้าเว็บ ซึ่งรวมถึงการรั่วไหลของหน่วยความจำ และอื่นๆ
ตรวจสอบ แก้ไข และแก้ไขข้อบกพร่องของเว็บแอป ทดสอบแคช ดูพื้นที่เก็บข้อมูล และอื่นๆ
ตรวจสอบและแก้ไขภาพเคลื่อนไหว
บันทึก เล่นซ้ำ วัดความไหลลื่นของผู้ใช้ และแก้ไขขั้นตอน
ค้นพบคอลเล็กชันตัวเลือกที่ส่งผลต่อการแสดงเนื้อหาเว็บ
ตรวจสอบและแก้ไขข้อบกพร่องของที่อยู่ที่บันทึกไว้
ค้นหาและแก้ไขปัญหาเกี่ยวกับเว็บไซต์ของคุณ
ตรวจสอบว่าหน้าเว็บได้รับการป้องกันอย่างเต็มที่ด้วย HTTPS
ดูข้อมูลและแก้ไขข้อบกพร่องของโปรแกรมเล่นสื่อตามแท็บเบราว์เซอร์
จำลองเซ็นเซอร์ของอุปกรณ์
จำลอง Authenticator