หน้านี้ได้รับการแปลโดย Cloud Translation API

นำ JavaScript ที่ไม่ได้ใช้ออก

JavaScript ที่ไม่ได้ใช้อาจทำให้ความเร็วในการโหลดหน้าเว็บของคุณช้าลง:

หาก JavaScript บล็อกการแสดงผลอยู่ เบราว์เซอร์จะต้องดาวน์โหลด แยกวิเคราะห์ คอมไพล์ และประเมินสคริปต์ก่อนที่จะทำงานอื่นๆ ทั้งหมดที่จำเป็นต่อการแสดงผลหน้าเว็บต่อได้
แม้ว่า JavaScript จะเป็นแบบไม่พร้อมกัน (ไม่ใช่การบล็อกการแสดงผล) แต่โค้ดจะแข่งขันเพื่อชิงแบนด์วิดท์กับทรัพยากรอื่นๆ ขณะดาวน์โหลด ซึ่งมีผลอย่างมากต่อประสิทธิภาพ การส่งโค้ดที่ไม่ได้ใช้ผ่านเครือข่ายยังเป็นการสิ้นเปลืองสำหรับผู้ใช้อุปกรณ์เคลื่อนที่ที่ไม่มีแพ็กเกจอินเทอร์เน็ตที่ไม่จำกัดอีกด้วย

วิธีที่การตรวจสอบ JavaScript ที่ไม่ได้ใช้งานล้มเหลว

Lighthouse จะแจ้งไฟล์ JavaScript ทุกไฟล์ที่มีโค้ดที่ไม่ได้ใช้งานมากกว่า 20 กิบิไบต์ ดังนี้

แท็บการครอบคลุมในเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สามารถแสดงรายละเอียดของโค้ดที่ไม่ได้ใช้ได้ทีละบรรทัด

คลาส Coverage ใน Puppeteer ช่วยให้กระบวนการตรวจหาโค้ดที่ไม่ได้ใช้งานเป็นไปโดยอัตโนมัติและการดึงข้อมูลโค้ดที่ใช้ได้

ตรวจสอบการทดสอบ Tooling.Report ต่อไปนี้เพื่อดูว่า Bundler รองรับฟีเจอร์ที่ช่วยให้หลีกเลี่ยงหรือนำโค้ดที่ไม่ได้ใช้ออกได้ง่ายขึ้นหรือไม่

หากคุณกำลังใช้ Angular CLI ให้รวมแมปที่มาในรุ่นที่ใช้งานจริงเพื่อตรวจสอบแพ็กเกจ

ลองนำเนื้อหา JavaScript ที่ไม่ได้ใช้ออก และแนบเฉพาะไลบรารี Drupal ที่จำเป็นลงในหน้าที่เกี่ยวข้องหรือคอมโพเนนต์ในหน้า ดูรายละเอียดในการกำหนดไลบรารี

ลองลดหรือเปลี่ยนจำนวนส่วนขยาย Joomla ที่โหลด JavaScript ที่ไม่ได้ใช้ในหน้าเว็บของคุณ

ปิดใช้การรวมกลุ่ม JavaScript ในตัวของ Magento

หากคุณไม่ได้กำลังแสดงผลฝั่งเซิร์ฟเวอร์ ให้แยกกลุ่ม JavaScript ด้วย React.lazy() หรือแยกโค้ดโดยใช้ไลบรารีของบุคคลที่สาม เช่น คอมโพเนนต์ที่โหลดได้

หากคุณไม่ได้กำลังแสดงผลฝั่งเซิร์ฟเวอร์และใช้เราเตอร์ Vue ให้แยกแพ็กเกจตามเส้นทางการโหลดแบบ Lazy Loading

ลองลดหรือเปลี่ยนจำนวนปลั๊กอิน WordPress ที่โหลด JavaScript ที่ไม่ได้ใช้ในหน้าเว็บของคุณ