ส่วนโอกาสของรายงาน Lighthouse จะแสดงรูปภาพทั้งหมดในรูปแบบรูปภาพเก่าๆ ซึ่งแสดงให้เห็นศักยภาพที่ประหยัดได้จากการแสดงรูปภาพเหล่านั้นในเวอร์ชัน AVIF
ทำไมแสดงภาพในรูปแบบ AVIF หรือ WebP
AVIF และ WebP เป็นรูปแบบรูปภาพที่มีคุณลักษณะในการบีบอัดและคุณภาพที่ดีกว่าเมื่อเทียบกับรูปแบบ JPEG และ PNG รุ่นเก่า การเข้ารหัสรูปภาพในรูปแบบเหล่านี้แทนที่จะเป็น JPEG หรือ PNG หมายความว่ารูปภาพจะโหลดเร็วขึ้นและใช้อินเทอร์เน็ตมือถือน้อยลง
AVIF ได้รับการสนับสนุนใน Chrome, Firefox และ Opera และมีขนาดไฟล์ที่เล็กกว่าเมื่อเทียบกับรูปแบบอื่นๆ ที่มีการตั้งค่าคุณภาพเท่ากัน ดูการแสดง Codelab สำหรับอิมเมจ AVIF สำหรับข้อมูลเพิ่มเติมเกี่ยวกับ AVIF
WebP ใช้ได้ใน Chrome, Firefox, Safari, Edge และ Opera เวอร์ชันล่าสุด และจะบีบอัดรูปภาพบนเว็บแบบสูญเสียและไม่สูญเสียข้อมูลได้ดีขึ้น ดูรูปภาพรูปแบบใหม่สำหรับเว็บสำหรับข้อมูลเพิ่มเติมเกี่ยวกับ WebP
Lighthouse คำนวณการประหยัดค่าใช้จ่ายอย่างไร
Lighthouse จะรวบรวมรูปภาพ BMP, JPEG และ PNG แต่ละภาพในหน้าเว็บ แปลงแต่ละภาพเป็น WebP และประมาณขนาดไฟล์ AVIF ซึ่งจะรายงานค่าใช้จ่ายที่อาจประหยัดได้จากตัวเลข Conversion
ความเข้ากันได้กับเบราว์เซอร์
WebP รองรับ Chrome, Firefox, Safari, Edge และ Opera เวอร์ชันล่าสุด ในขณะที่การรองรับ AVIF จะมีข้อจำกัดมากกว่า คุณจะต้องแสดงรูปภาพ PNG หรือ JPEG สำรองสำหรับการรองรับเบราว์เซอร์เวอร์ชันเก่า ดูภาพรวมของเทคนิคสำรองและรายการการรองรับรูปแบบรูปภาพของเบราว์เซอร์ได้ที่ฉันจะตรวจหาการรองรับ WebP ของเบราว์เซอร์ได้อย่างไร
หากต้องการดูการรองรับเบราว์เซอร์ในปัจจุบันสำหรับรูปแบบสมัยใหม่แต่ละรูปแบบ โปรดดูรายการด้านล่างนี้
คำแนะนำเฉพาะกลุ่ม
AMP
ลองแสดงคอมโพเนนต์ amp-img ทั้งหมดในรูปแบบ WebP โดยระบุรายการสำรองที่เหมาะสมสำหรับเบราว์เซอร์อื่นด้วย
Drupal
ลองติดตั้งและกำหนดค่าโมดูลเพื่อใช้ประโยชน์จากรูปแบบรูปภาพ WebP ในเว็บไซต์ โมดูลดังกล่าวจะสร้างเวอร์ชัน WebP ของรูปภาพที่อัปโหลดโดยอัตโนมัติเพื่อปรับปรุงเวลาที่ใช้ในการโหลด
จูมลา
ลองใช้pluginหรือบริการที่จะแปลงรูปภาพที่อัปโหลดเป็นรูปแบบที่เหมาะสมที่สุดโดยอัตโนมัติ
Magento
ลองค้นหาในตลาดกลางของ Magento เพื่อหาส่วนขยายต่างๆ ของบุคคลที่สามเพื่อใช้ประโยชน์จากรูปแบบรูปภาพที่ใหม่กว่า
iPhone
โปรดทราบว่า WebP, รูปภาพ Avif และวิดีโอ WebM จะไม่ทำงานบน iPhone ที่ต่ำกว่า iOS 16
WordPress
ลองใช้pluginหรือบริการที่จะแปลงรูปภาพที่อัปโหลดเป็นรูปแบบที่เหมาะสมที่สุดโดยอัตโนมัติ