ดูคอลเล็กชันตัวเลือกที่ส่งผลต่อการเรนเดอร์เนื้อหาเว็บด้วยภาพรวมฟีเจอร์แท็บการแสดงผลในเครื่องมือสําหรับนักพัฒนาเว็บ
ภาพรวม
แท็บการแสดงผลช่วยให้คุณทำสิ่งต่อไปนี้ได้
- ดูปัญหาด้านประสิทธิภาพการแสดงผล ตรวจหาการวาดภาพใหม่ การเปลี่ยนแปลงเลย์เอาต์ เลเยอร์และไทล์ ปัญหาการเลื่อน ดูสถิติการแสดงผล และ Core Web Vitals
- จำลองฟีเจอร์สื่อ CSS ทดสอบวิธีที่หน้าเว็บแสดงผลด้วยฟีเจอร์สื่อ CSS ต่างๆ โดยไม่ต้องระบุฟีเจอร์เหล่านั้นด้วยตนเองในโค้ดหรือสภาพแวดล้อมการทดสอบ
- ใช้เอฟเฟกต์อื่นๆ ที่มีประโยชน์ ไฮไลต์เฟรมโฆษณา จำลองโฟกัสในหน้าเว็บ ปิดใช้แบบอักษรและรูปแบบรูปภาพในเครื่อง เปิดใช้ธีมมืดโดยอัตโนมัติ และจำลองการมองเห็นที่บกพร่อง
เปิดแท็บการแสดงผล
วิธีเปิดแท็บการแสดงผล
กด Command+Shift+P (Mac) หรือ Control+Shift+P (Windows, Linux, ChromeOS) เพื่อเปิดเมนูคำสั่ง
เริ่มพิมพ์
rendering
เลือกแสดงการแสดงผล แล้วกด Enter DevTools จะแสดงแท็บการแสดงผลที่ด้านล่างของหน้าต่าง DevTools
หรือจะเปิดแท็บการแสดงผลด้วยวิธีต่อไปนี้ก็ได้
- กด Esc เพื่อเปิดลิ้นชัก แล้วคลิกเครื่องมือเพิ่มเติม
> การแสดงผลที่มุมซ้ายบน
- ที่มุมขวาบน ให้คลิกตัวเลือกเพิ่มเติม
> เครื่องมือเพิ่มเติม > การแสดงผล