ดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

Lazy Loading

เวอร์ชัน: 3.7.0

ประเภทของส่วนเสริม: Component

รองรับกับ Joomla: 3.x


  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 เพื่อทำการตั้งค่าการใช้งาน Lazy loadingคลิก Options เพื่อทำการตั้งค่า

 

จากนั้นจะเห็นหน้า SP Page Builder Configuration ทำการเปิดการใช้งาน Lazy Loading เมื่อเปิดใช้งานแล้ว จะแสดง ฟิลด์ Placeholder Image ภาพนี้จะถูกใช้ก่อนที่จะทำการโหลดเนื้อหา ควรใช้ไฟล์ภาพที่เบาที่สุดเท่าที่จะเป็นไปได้

ตัวอย่างแสดงขั้นตอนการเปิดใช้งาน Lazy loading
ทำการเปิดใช้งาน Lazy loading

 

Carousel Option ในส่วนเสริม Clients

   นอกจากนี้ ยังมีการเพิ่มฟีเจอร์ Carousel Option ในส่วนเสริม Clients ซึ่งในเวอร์ชั่นนี้สามารถทำ Slide ให้กับ logo ของลูกค้าได้ เพียงทำการเปิดใช้งาน Use As Carousel

ตัวอย่างฟีเจอร์ใหม่ของส่วนเสริม Client
Carousel Option ฟีเจอร์ใหม่ของส่วนเสริม Client

 

   SP Page Builder เป็นตัวช่วยที่ดีในการสร้างเว็บไซต์บน Joomla และในการอัพเดตครั้งนี้ยังมีฟีเจอร์อย่าง Lazy Loading ที่จะเข้ามาช่วยให้หน้าเว็บของโหลดเร็วขึ้นมากกว่าเดิม


Version 3.7.0 2020-02-19

New

  • เพิ่มฟีเจอร์ Lazy Load
  • Carousel option ในส่วนเสริม Clients

Update

  • รูปแบบแผนที่ 2 แบบ (Open Street Black / White, Hike Bike) ถูกลบเนื่องจาก API ไม่ตอบสนองปัญหา

Bug fix

  • ปัญหาค่าที่ไม่ใช่ตัวเลขในส่วนเสริม Testimonial Carousel
  • ระยะ ขอบแถว ภายในขอบ: ไม่ทำงานอัตโนมัติ

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
งานประจำวันที่ 2 มิถุนายน 2563
โดย natthanit.r2538 อ 02 มิ.ย. 2020 10:11 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
4
31
อ 02 มิ.ย. 2020 7:42 pm โดย natthanit.r2538
มารู้จักจังหวัดสงขลา เมืองสองทะเลกันค่ะ
โดย natthanit.r2538 อ 02 มิ.ย. 2020 4:27 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
7
อ 02 มิ.ย. 2020 4:27 pm โดย natthanit.r2538
ระบบบัญชีคืออะไร มีความสำคัญอย่างไร และจะทำอย่างไรหากต้องการวางระบบบัญชี
โดย natthanit.r2538 อ 02 มิ.ย. 2020 2:13 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
4
อ 02 มิ.ย. 2020 2:13 pm โดย natthanit.r2538
เปิดบริษัทต้องจดทะเบียนภาษีมูลค่าเพิ่มหรือไม่ ภาษีมูลค่าเพิ่มคืออะไร ??
โดย natthanit.r2538 อ 02 มิ.ย. 2020 12:16 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
7
อ 02 มิ.ย. 2020 12:16 pm โดย natthanit.r2538
ภ.ง.ด. 1,3,53 คืออะไร
โดย natthanit.r2538 อ 02 มิ.ย. 2020 11:08 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
7
อ 02 มิ.ย. 2020 11:08 am โดย natthanit.r2538
สรุปการประชุมลูกค้าครั้งแรก
โดย natthanit.r2538 จ 01 มิ.ย. 2020 6:46 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
2
จ 01 มิ.ย. 2020 6:46 pm โดย natthanit.r2538
สวนครัวริมระเบียง
โดย natthanit.r2538 จ 01 มิ.ย. 2020 4:42 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
10
จ 01 มิ.ย. 2020 4:42 pm โดย natthanit.r2538
วิธีการเดินทางจาก สงขลา มา กรุงเทพฯ
โดย natthanit.r2538 จ 01 มิ.ย. 2020 1:47 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
17
จ 01 มิ.ย. 2020 1:47 pm โดย natthanit.r2538
งานประจำวันที่ 1 มิถุนายน 2563
โดย natthanit.r2538 จ 01 มิ.ย. 2020 10:53 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
2
32
อ 02 มิ.ย. 2020 10:00 am โดย natthanit.r2538
note
โดย natthanit.r2538 จ 01 มิ.ย. 2020 10:52 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
6
จ 01 มิ.ย. 2020 10:52 am โดย natthanit.r2538
Work's on Hand ณัฐนิตย์ ร่มบ้านโหล๊ะ M103
โดย natthanit.r2538 จ 01 มิ.ย. 2020 10:49 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
4
จ 01 มิ.ย. 2020 10:49 am โดย natthanit.r2538
list ความรู้ที่มี ว่าเคยเรียน หรือ เคยทำอะไรมาบ้าง
โดย natthanit.r2538 จ 01 มิ.ย. 2020 10:48 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
2
23
จ 01 มิ.ย. 2020 11:08 am โดย natthanit.r2538
B - เข้าเมนูหน้ารวมรายการใน admin ไม่ได้
โดย thatsawan ศ 29 พฤษภาคม 2020 5:58 pm บอร์ด Odoojob.com - Tester
0
1
ศ 29 พฤษภาคม 2020 5:58 pm โดย thatsawan
B - ยังขาดหน้าผลการค้นหา จาก search.php
โดย mindphp ศ 29 พฤษภาคม 2020 6:11 am บอร์ด FDD (Main)
0
1
ศ 29 พฤษภาคม 2020 6:11 am โดย mindphp
B - กล่องค้นหาจากหน้า index ใช้งานไม่ได้ กดแล้วไม่ไปหน้าค้นหา
โดย mindphp ศ 29 พฤษภาคม 2020 5:39 am บอร์ด FDD (Main)
1
1
ศ 29 พฤษภาคม 2020 5:53 am โดย mindphp
B - ไม่ใช่แค่โชว์ icon facebook มันต้องทำลิงค์เพื่อให้คลิกไป
โดย mindphp ศ 29 พฤษภาคม 2020 4:39 am บอร์ด FDD (Main)
1
2
ศ 29 พฤษภาคม 2020 4:51 am โดย mindphp
อัพเดท phpbb 3.3 เเล้ว extenstion ใช้งานไม่ได้
โดย thatsawan พฤ 28 พฤษภาคม 2020 10:08 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS, CRM
1
114
พฤ 28 พฤษภาคม 2020 10:10 pm โดย thatsawan
วิธีการสร้าง css ที่ใช้งานเฉพาะในบราวเซอร์ safari เท่านั้น
โดย Ittichai_chupol พฤ 28 พฤษภาคม 2020 6:06 pm บอร์ด CSS Knowledge
0
111
พฤ 28 พฤษภาคม 2020 6:06 pm โดย Ittichai_chupol
R - Set Demo เป็น subdomain ของ ตัวนี้
โดย mindphp พฤ 28 พฤษภาคม 2020 6:17 am บอร์ด มารียา ซีฟู้ดส์ - Developer
0
9
พฤ 28 พฤษภาคม 2020 6:17 am โดย mindphp
อยากทราบวิธีการกำหนด ค่า css ให้กับ button โดยกำหนดเฉพาะแต่ละบราวเซอร์
โดย Ittichai_chupol พ 27 พฤษภาคม 2020 8:39 pm บอร์ด HTML CSS
1
42
พ 27 พฤษภาคม 2020 9:15 pm โดย mindphp