เลื่อนเวลาโหลดรูปภาพนอกหน้าจอ

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

ภาพหน้าจอของการตรวจสอบ "เลื่อนเวลาโหลดรูปภาพนอกจอภาพ" ของ Lighthouse

ดูCodelab การโหลดรูปภาพนอกหน้าจอแบบ Lazy Loading ด้วย lazysizes ด้วย

คำแนะนำเฉพาะสำหรับกองซ้อน

AMP

โหลดรูปภาพแบบ Lazy Loading โดยอัตโนมัติด้วย amp-img ดูคำแนะนำเกี่ยวกับรูปภาพ

Drupal

ลองกำหนดค่ารูปภาพที่โหลดแบบ Lazy Loading ใน Drupal ตัวจัดรูปแบบช่องสำหรับรูปภาพรองรับ lazy หรือ eager

Joomla

ติดตั้งปลั๊กอินการโหลดแบบ Lazy Loading ของ Joomla ที่จะช่วยให้เลื่อนเวลาโหลดรูปภาพนอกจอภาพได้ หรือเปลี่ยนไปใช้เทมเพลต ที่มีฟังก์ชันดังกล่าว ตั้งแต่ Joomla 4.0 เป็นต้นไป คุณเปิดใช้ปลั๊กอินสำหรับการโหลดแบบ Lazy Loading โดยเฉพาะได้ โดยใช้ปลั๊กอิน "เนื้อหา - รูปภาพสำหรับการโหลดแบบ Lazy Loading" และอาจลองใช้ปลั๊กอิน AMP ด้วย

Magento

ลองแก้ไขเทมเพลตผลิตภัณฑ์และแคตตาล็อกเพื่อใช้ประโยชน์จากฟีเจอร์การโหลดแบบ Lazy Loading ของแพลตฟอร์มเว็บ

WordPress

ติดตั้งปลั๊กอินการโหลดแบบ Lazy Loading ของ WordPress ที่จะช่วย เลื่อนเวลาโหลดรูปภาพนอกหน้าจอ หรือเปลี่ยนไปใช้ธีมที่มีฟังก์ชันดังกล่าว และอาจลองใช้ปลั๊กอิน AMP ด้วย

แหล่งข้อมูล