ใช้ document.write()

การใช้ document.write() อาจทำให้การแสดงเนื้อหาของหน้าเว็บช้าลงหลายสิบวินาที และจะเป็นปัญหาอย่างยิ่งสำหรับผู้ใช้ที่มีการเชื่อมต่อที่ช้า ดังนั้น Chrome จึงบล็อกการดำเนินการของ document.write() ในหลายกรณี ซึ่งหมายความว่าคุณไม่สามารถใช้ document.write() ได้

ในคอนโซลเครื่องมือสำหรับนักพัฒนาเว็บของ Chrome คุณจะเห็นข้อความต่อไปนี้เมื่อใช้ document.write()

[Violation] Avoid using document.write().

คุณจะเห็นข้อความนี้ในคอนโซลเครื่องมือสำหรับนักพัฒนาเว็บของ Firefox

An unbalanced tree was written using document.write() causing
data from the network to be reparsed.

สาเหตุที่การตรวจสอบ document.write() ของ Lighthouse ไม่ผ่าน

Lighthouse จะแจ้งว่าการเรียกใช้ document.write() ต่อไปนี้ไม่ถูกบล็อกโดย Chrome

การตรวจสอบ Lighthouse ที่แสดงการใช้งาน document.write

สำหรับการใช้งานที่มีปัญหามากที่สุด Chrome จะบล็อกการเรียกใช้ document.write() หรือแสดงคำเตือนเกี่ยวกับคอนโซล ทั้งนี้ขึ้นอยู่กับความเร็วในการเชื่อมต่อของผู้ใช้ ไม่ว่าจะด้วยวิธีใด การเรียกที่ได้รับผลกระทบจะปรากฏในคอนโซล DevTools ดูข้อมูลเพิ่มเติมได้ในบทความการแทรกแซงdocument.write()ของ Google

Lighthouse จะรายงานการเรียกใช้ document.write() ที่เหลืออยู่เนื่องจากส่งผลเสียต่อประสิทธิภาพไม่ว่าจะมีการใช้งานอย่างไร และยังมีทางเลือกอื่นๆ ที่ดีกว่า

หลีกเลี่ยง document.write()

นำการใช้ document.write() ทั้งหมดในโค้ดออก หากมีการใช้เพื่อแทรกสคริปต์ของบุคคลที่สาม ให้ลองใช้การโหลดแบบไม่พร้อมกันแทน

หากโค้ดของบุคคลที่สามใช้ document.write() ให้ขอให้ผู้ให้บริการรองรับการโหลดแบบอะซิงโครนัส

แหล่งข้อมูล