Lazy load ฟีเจอร์ใหม่ของ SP Page Builder Pro ช่วยให้หน้าเว็บพร้อมตอบสนองผู้ใช้งานได้อย่างรวดเร็ว

SP Page Builder Pro เป็น Extensions เสริมสำหรับ Joomla เป็นเครื่องมือที่ใช้สำหรับจัดการเนื้อหาหน้าเว็บไซต์ ซึ่ง SP Page Builder Pro นั้นจะใช้ระบบการสร้างเว็บไซต์แบบ Drag & Drop (คลิ้ก ลาก วาง) หรือ WYSIWYG (What You See Is What You Get) ในปัจจุบัน SP Page Builder Pro ได้มีการอัปเดตเวอร์ชั่นใหม่ เป็นเวอร์ชั่น 3.7.0 โดยได้มีการเพิ่มฟีเจอร์ " Lazy Loading " ที่จะช่วยให้การโหลดหน้าเว็บไซต์เร็วขึ้นกว่าเดิม
การอัพเดต SP Page Builder Pro เวอร์ชั่น 3.7.0
- New: เพิ่มฟีเจอร์ Lazy Load
- New: Carousel option ในส่วนเสริม Clients
- New: ตัวกรองรูปภาพและตัวเลือกแบบโฮเวอร์ใน แอดออน ของลูกค้า
- Update: รูปแบบแผนที่ 2 แบบ (Open Street Black / White, Hike Bike) ถูกลบเนื่องจาก API ไม่ตอบสนองปัญหา
- Fix: ปัญหาค่าที่ไม่ใช่ตัวเลขในส่วนเสริม Testimonial Carousel
- Fix: ระยะ ขอบแถว ภายในขอบ: ไม่ทำงานอัตโนมัติกับปัญหาส่วนหน้า
Lazy Loading คืออะไร ?
ก่อนที่จะทำความเข้าใจเกี่ยวกับ Lazy Loading เราต้องเข้าใจเกี่ยวกับการโหลดหน้าเว็บของ browser ก่อน เมื่อเราทำการโหลดหน้าเว็บบน browser เนื้อหาทั้งหมดของหน้านั้นจะถูกโหลดพร้อมกัน เมื่อดาวน์โหลดเนื้อหาทั้งหมดเสร็จแล้วจึงจะได้เห็นหน้าเว็บ ซึ่งกระบวนการนี้ใช้จะเวลานานมากทำให้ผู้ใช้ต้องเสียเวลารอโดยไม่จำเป็น
หากเปิดใช้งาน Lazy Loading เนื้อหาทั้งหมด ไม่ว่าจะเป็นรูปภาพหรือวิดีโอที่อยู่ในหน้าเว็บจะไม่สามารถโหลดพร้อมกันได้ ซึ่งหากใช้งาน Lazy Load จะทำการโหลดหน้าเว็บเพียงบางส่วนเท่านั้น และเนื้อหาที่เหลือจะโหลดเมื่อผู้ใช้เลื่อนลงไปถึงเนื้อหา
ประเภทของ Lazy Loading ใน SP Page Builder
ในการอัปเดต SP Page Builder จะมี Lazy Loading 2 ประเภท ประเภทแรกคือ native lazy loading สำหรับผู้ใช้ Chrome จะทำการเลื่อนการโหลดเนื้อหาออกไป จนกว่าผู้ใช้งานจะเลื่อนลงไปที่เนื้อหา และอีกประเภทคือ IntersectionObserver’s สำหรับผู้ที่ไม่ได้ใช้ Chrome
วิธีการเปิดใช้งาน Lazy Loading บน Joomla
เว็บไซต์ที่สร้างโดยใช้ SP Page Builder Pro ตอนนี้สามารถใช้ Lazy Loading ได้ภายในคลิกเดียว โดยผู้ใช้งานสามารถทำการเปิดใช้งาน Lazy Loading จาก Global Configuration ทำการคลิกที่ปุ่ม Options ที่มุมขวาบนในหน้า SP Page Builder panel
คลิก Options เพื่อทำการตั้งค่า
จากนั้นจะเห็นหน้า SP Page Builder Configuration ทำการเปิดการใช้งาน Lazy Loading เมื่อเปิดใช้งานแล้ว จะแสดง ฟิลด์ Placeholder Image ภาพนี้จะถูกใช้ก่อนที่จะทำการโหลดเนื้อหา ควรใช้ไฟล์ภาพที่เบาที่สุดเท่าที่จะเป็นไปได้
ทำการเปิดใช้งาน Lazy loading
Carousel Option ในส่วนเสริม Clients
นอกจากนี้ ยังมีการเพิ่มฟีเจอร์ Carousel Option ในส่วนเสริม Clients ซึ่งในเวอร์ชั่นนี้สามารถทำ Slide ให้กับ logo ของลูกค้าได้ เพียงทำการเปิดใช้งาน Use As Carousel
Carousel Option ฟีเจอร์ใหม่ของส่วนเสริม Client
SP Page Builder เป็นตัวช่วยที่ดีในการสร้างเว็บไซต์บน Joomla และในการอัพเดตครั้งนี้ยังมีฟีเจอร์อย่าง Lazy Loading ที่จะเข้ามาช่วยให้หน้าเว็บของโหลดเร็วขึ้นมากกว่าเดิม