ปลั๊กอิน Lazy Load ที่ดีที่สุดเพื่อทำให้ไซต์ WordPress ของคุณเร็วขึ้น

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

แล้วทางออกคืออะไร? ขี้เกียจโหลด.

อ่านต่อหรือข้ามไปข้างหน้าโดยใช้ลิงก์เหล่านี้:

• Native Lazy Loading มาถึงแล้วด้วย WordPress 5.5
• ปลั๊กอินจำเป็นอีกต่อไปหรือไม่?
  • เข้าถึงอินเทอร์เฟซ
  • ความเข้ากันได้ของเบราว์เซอร์
  • การเพิ่มประสิทธิภาพพิเศษ
• Native Lazy Loading มีประโยชน์หรือไม่?
• ปลั๊กอินโหลดขี้เกียจที่ดีที่สุด
• ข้อมูลเพิ่มเติมเกี่ยวกับ Lazy Loading

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

โดยสรุป มันบังคับให้โหลดรูปภาพเฉพาะเมื่อพวกมัน "อยู่ครึ่งหน้าบน" - กล่าวคือ เฉพาะภาพที่เข้ามาในเบราว์เซอร์ของผู้ใช้เท่านั้นที่จะโหลด

ดังนั้น หากคุณมีหน้าเว็บที่มีธีม WordPress แบบเต็มหน้าจอและฟรี 10 แบบ เฉพาะภาพสองสามภาพแรกในโพสต์เท่านั้นที่จะโหลดและภาพอื่นๆ จะโหลดเมื่อผู้ใช้เลื่อนหน้าลง

Native Lazy Loading มาถึงแล้วด้วย WordPress 5.5

การโหลดแบบขี้เกียจยังคงเป็นคุณสมบัติที่ค่อนข้างใหม่สำหรับ WordPress

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

หากคุณมีปลั๊กอินการโหลดแบบ Lazy Loading Plugin ที่คุณภักดีหรือผ่านขั้นตอนที่คุณไม่ต้องการเปิดใช้งานการโหลดแบบ Lazy เลย คุณจะยินดีที่ทราบว่าคุณสามารถปิดการใช้งานได้

ปลั๊กอินบางตัวทำสิ่งนี้โดยอัตโนมัติ อย่างไรก็ตาม หากคุณต้องการทำด้วยตนเอง เพียงไปที่ไฟล์ functions.php ของคุณแล้วเพิ่มสิ่งต่อไปนี้:

add_filter( 'wp_lazy_loading_enabled', '__return_false' );

การดำเนินการนี้จะปิดใช้งานคุณลักษณะการโหลดแบบ Lazy Loading ของ WordPress ซึ่งหมายความว่าคุณจะสามารถใช้ปลั๊กอินที่คุณเลือกได้โดยไม่เสี่ยงต่อการเกิดข้อขัดแย้ง

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

ปลั๊กอินจำเป็นอีกต่อไปหรือไม่?

คุณอาจสงสัยว่าจะใช้ปลั๊กอินเลยหรือไม่ เพราะ WordPress เสนอการโหลดแบบเนทีฟแบบเนทีฟ

อ่านต่อเพราะมีเหตุผลสองสามประการที่คุณอาจต้องการใช้ปลั๊กอิน:

เข้าถึงอินเทอร์เฟซ

ปลั๊กอินการโหลดแบบ Lazy Loading ที่ดี เช่น Smush มีอินเทอร์เฟซที่มีตัวเลือกในการปรับแต่งการตั้งค่าเฉพาะ ตลอดจนความสามารถในการเปิดและปิดการโหลดแบบ Lazy Loading เพียงกดปุ่ม

ตัวเลือกเหล่านี้อาจมีตั้งแต่ประเภทรูปภาพที่จะโหลดแบบ Lazy Loading ไปจนถึงหน้าที่โหลดแบบ Lazy Loading หากคุณต้องการเปลี่ยนการตั้งค่าเช่นนี้โดยไม่ต้องใช้ปลั๊กอิน คุณจะต้องเจาะลึกเข้าไปในโค้ดและเพิ่มข้อยกเว้นเหล่านี้ด้วยตนเอง

ความเข้ากันได้ของเบราว์เซอร์

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

การเพิ่มประสิทธิภาพพิเศษ

ปลั๊กอินส่วนใหญ่มีมากกว่าแค่การโหลดแบบ Lazy Loading การแนะนำปลั๊กอินการเพิ่มประสิทธิภาพภาพให้กับเว็บไซต์ของคุณอาจเป็นหนึ่งในการตัดสินใจที่ดีที่สุดที่คุณจะทำ

ปลั๊กอินเช่น Smush สามารถช่วยให้คุณได้รับคำแนะนำ PageSpeed ​​เกี่ยวกับรูปภาพของ Google และเพิ่มความเร็วให้กับไซต์ของคุณ การโหลดแบบ Lazy Loading เป็นเพียงจุดเริ่มต้นเท่านั้น!

Native Lazy Loading มีประโยชน์หรือไม่?

บนพื้นผิว ดูเหมือนว่าปลั๊กอินจะทำทุกอย่างที่การโหลดแบบเนทีฟแบบเนทีฟสามารถทำได้ และอื่นๆ อีกมากมาย

แม้ว่าสิ่งนี้จะถูกต้องในทางเทคนิค แต่ความแตกต่างที่สำคัญคือปลั๊กอินส่วนใหญ่จะเกี่ยวข้องกับการแนะนำไลบรารี JavaScript ซึ่งเว็บไซต์ของคุณจะขึ้นอยู่กับ

การโหลดแบบเนทีฟแบบ Lazy Loading นั้นเรียบง่ายและตรงไปตรงมามากกว่า และไม่ต้องการโค้ดเพิ่มเติมมากนัก

ปลั๊กอินการเพิ่มประสิทธิภาพรูปภาพของเรา Smush เสนอการโหลดแบบ Lazy Loading แบบเนทีฟในเวอร์ชันของตัวเอง

มันทำงานบนพื้นฐานเดียวกับ WordPress แต่รองรับรูปแบบรูปภาพทั้งหมดที่ Smush ทำ

การโหลดแบบเนทีฟแบบเนทีฟอาจเป็นสิ่งที่สามารถใช้เป็นพื้นฐานสำหรับการพัฒนาอื่นๆ ได้ในอนาคต แต่อย่างน้อยสำหรับตอนนี้ ปลั๊กอินก็เหมาะสมสำหรับเว็บไซต์ส่วนใหญ่

หากคุณชอบแนวคิดเกี่ยวกับปลั๊กอินเพื่อแก้ปัญหาความต้องการการโหลดแบบ Lazy Loading เราได้รวบรวมคอลเล็กชันปลั๊กอินการโหลดแบบ Lazy Loading ฟรีไว้ด้วยกัน

• การเพิ่มประสิทธิภาพภาพ Smush

  

  Smush เป็นปลั๊กอินเพิ่มประสิทธิภาพรูปภาพแบบ all-in-one ที่ได้รับความนิยมมากที่สุดด้วยเหตุผล เรารวมทุกสิ่งที่คุณต้องการเพื่อให้รูปภาพของคุณโหลดเร็วขึ้น

  Lazy Loading สามารถใช้ได้กับ Smush เวอร์ชันฟรีและ Smush Pro ที่ชาร์จเทอร์โบ ซึ่งมาพร้อมกับ Smush Pro CDN และไม่เหมือนกับการโหลดแบบ Lazy Loading แบบเนทีฟ ซึ่งเข้ากันได้กับเบราว์เซอร์ทั้งหมด

  

  เพื่อเปิดใช้งานการโหลดแบบ Lazy Loading ด้วย Smush เราได้ทำให้กระบวนการ super-duper ง่ายขึ้น สิ่งที่คุณต้องทำคือไปที่ส่วน Lazy Loading ใน Smush แล้วกดปุ่ม เปิดใช้งาน แค่นั้นแหละ.

  คุณสามารถปรับการตั้งค่าเพิ่มเติมได้เมื่อเปิดใช้งานการโหลดแบบ Lazy Loading แต่ไม่จำเป็น การตั้งค่าเริ่มต้นของ Smush และ Smush Pro คือทั้งหมดที่คุณต้องการเพื่อดูการปรับปรุงประสิทธิภาพครั้งใหญ่

• a3 ขี้เกียจโหลด

  

  A3 Lazy Load เป็นปลั๊กอินยอดนิยมสำหรับการโหลดรูปภาพ, iframes, วิดีโอ และองค์ประกอบอื่นๆ ในไซต์ของคุณแบบ Lazy Loading

  มีการตั้งค่ามากมาย คุณจึงปรับแต่งได้ว่าต้องการให้โหลดเนื้อหาบนไซต์ของคุณอย่างไร

  นอกจากนี้ยังผ่านการทดสอบว่าเข้ากันได้ 100% กับปลั๊กอินยอดนิยม เช่น WooCommerce, Advanced Custom Fields และ CDN ที่หลากหลาย

• ขี้เกียจ

  

  นี่เป็นอีกหนึ่งปลั๊กอินการโหลดแบบขี้เกียจพิเศษที่ใช้งานได้จริง ไม่จำเป็นต้องมีการกำหนดค่าที่ซับซ้อน

  ขึ้นอยู่กับธีมหรือการใช้งานของ jQuery, Crazy Lazy ทางเลือกจะใช้ปลั๊กอิน jQuery รุ่นแก้ไข Unveil.js หรือไลบรารี JavaScript ดั้งเดิม lazyload.js

• โหลดขี้เกียจสำหรับวิดีโอ

  

  ปลั๊กอินการโหลดแบบ Lazy Loading บางตัวอาจใช้งานกับวิดีโอได้ ซึ่งน่าเสียดายเพราะวิดีโอสามารถเพิ่มขนาดไฟล์หน้าเว็บของคุณจำนวนมากได้ดีกว่ารูปภาพ

  Lazy Load for Videos สามารถช่วยให้คุณขี้เกียจโหลดวิดีโอที่โฮสต์บน Vimeo หรือ YouTube มันโหลดภาพตัวยึดตำแหน่งและโหลดเฉพาะเครื่องเล่นวิดีโอและวิดีโอแบบเต็มหากผู้เยี่ยมชมคลิกที่มัน

  นี่เป็นสิ่งสำคัญหากไซต์ของคุณมีวิดีโอจำนวนมาก และคุณเลือกปลั๊กอินน้ำหนักเบาที่ไม่มีการโหลดแบบ Lazy Loading สำหรับวิดีโอ

ข้อมูลเพิ่มเติมเกี่ยวกับ Lazy Loading

การใช้ปลั๊กอินเป็นวิธีที่ง่ายที่สุดในการเพิ่มการโหลดแบบ Lazy Loading ให้กับไซต์ของคุณ แต่ไม่ใช่วิธีเดียว คุณยังสามารถใช้ JavaScript บนไซต์ของคุณได้หากต้องการโซลูชันที่บางกว่า

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

หากคุณต้องการเรียนรู้เพิ่มเติมเกี่ยวกับคุณสมบัติการโหลดแบบ Lazy Loading ของ WordPress โปรดดูประกาศ

วิธีที่ง่ายที่สุดในการเริ่มต้นใช้งานการโหลดแบบ Lazy Loading คือ Smush free หรือ Smush Pro

Smush Pro เพิ่มคุณสมบัติอื่นๆ ที่สามารถช่วยคุณในโอกาสอื่นๆ ของ Google PageSpeed ​​Insights สามารถช่วยให้คุณ แสดงภาพในรูปแบบ Next-Gen โดยแปลงภาพของคุณเป็นไฟล์ WebP และปรับ ขนาดภาพอย่างเหมาะสม โดยปรับขนาดภาพด้วย Smush Pro CDN Smush Pro ยังเข้ากันได้กับปลั๊กอิน WP Retina 2x ยอดนิยม ดังนั้นคุณจึงสามารถโหลดภาพ Retina ขนาดใหญ่เหล่านั้นได้โดยไม่ทำให้ WordPress ทำงานช้าลง

ลองใช้ Smush Pro ฟรี และดูว่ามันสร้างความแตกต่างให้กับไซต์ของคุณได้มากน้อยเพียงใด

• ภาพ