ทรัพยากรแบบข้อความควรแสดงพร้อมการบีบอัดเพื่อลดขนาดไบต์รวมของเครือข่าย ส่วนโอกาสของรายงาน Lighthouse จะแสดงรายการทรัพยากรแบบข้อความทั้งหมดที่ไม่มีการบีบอัด
วิธีที่ Lighthouse จัดการการบีบอัดข้อความ
Lighthouse รวบรวมคำตอบทั้งหมดที่มีลักษณะดังนี้
- มีประเภททรัพยากรแบบข้อความ
- อย่าใส่ส่วนหัว
content-encodingที่ตั้งค่าเป็นbr,gzipหรือdeflate
จากนั้น Lighthouse จะบีบอัดแต่ละรายการด้วย GZIP เพื่อคํานวณการประหยัดค่าใช้จ่ายที่เป็นไปได้
หากขนาดคำตอบเดิมต่ำกว่า 1.4KiB หรือหากการลดการบีบอัดที่เป็นไปได้น้อยกว่า 10% ของขนาดดั้งเดิม Lighthouse จะไม่แจ้งการตอบสนองนั้นในผลลัพธ์
เปิดใช้การบีบอัดข้อความในเซิร์ฟเวอร์
เปิดใช้การบีบอัดข้อความในเซิร์ฟเวอร์ที่ให้บริการการตอบกลับเหล่านี้เพื่อผ่านการตรวจสอบนี้
เมื่อเบราว์เซอร์ขอทรัพยากร เบราว์เซอร์จะใช้ส่วนหัวของคำขอ HTTP Accept-Encoding เพื่อระบุอัลกอริทึมการบีบอัดที่เบราว์เซอร์รองรับ
Accept-Encoding: gzip, compress, br
หากเบราว์เซอร์รองรับ Brotli (br) คุณควรใช้ Brotli เพราะอาจลดขนาดไฟล์ของทรัพยากรได้มากกว่าอัลกอริทึมการบีบอัดอื่นๆ ค้นหา how to enable Brotli compression in <X> โดยที่ <X> คือชื่อเซิร์ฟเวอร์ของคุณ ตั้งแต่เดือนธันวาคม 2022 เป็นต้นไป Brotli รองรับในเบราว์เซอร์หลักๆ ทุกเบราว์เซอร์ยกเว้น Safari ใน iOS ดู
ความเข้ากันได้กับเบราว์เซอร์
สำหรับการอัปเดต
ใช้ GZIP เป็นโหมดสำรองสำหรับ Brotli GZIP ได้รับการสนับสนุนในเบราว์เซอร์หลักๆ ทั้งหมด แต่มีประสิทธิภาพน้อยกว่า Brotli ดูตัวอย่างได้ที่การกำหนดค่าเซิร์ฟเวอร์
เซิร์ฟเวอร์ควรแสดงผลส่วนหัวการตอบสนอง HTTP Content-Encoding เพื่อระบุอัลกอริทึมการบีบอัดที่ใช้
Content-Encoding: br
ตรวจสอบการบีบอัดการตอบสนอง
วิธีตรวจสอบว่าเซิร์ฟเวอร์บีบอัดการตอบกลับหรือไม่
กด Control+Shift+J (หรือ Command+Option+J ใน Mac) เพื่อเปิดเครื่องมือสำหรับนักพัฒนาเว็บ
คลิกแท็บ Network
- กด Control+Shift+J (หรือ Command+Option+J ใน Mac) เพื่อเปิดเครื่องมือสำหรับนักพัฒนาเว็บ
- คลิกแท็บเครือข่าย
- คลิกคำขอที่ทำให้เกิดคำตอบที่คุณสนใจ
- คลิกแท็บส่วนหัว
- ตรวจสอบส่วนหัว
content-encodingในส่วน ส่วนหัวการตอบกลับ
content-encoding
วิธีเปรียบเทียบขนาดของคำตอบที่บีบอัดและคลายการบีบอัด
- กด Control+Shift+J (หรือ Command+Option+J ใน Mac) เพื่อเปิดเครื่องมือสำหรับนักพัฒนาเว็บ
- คลิกแท็บเครือข่าย
- เปิดใช้แถวคำขอขนาดใหญ่ โปรดดูหัวข้อใช้แถวคำขอขนาดใหญ่
- ดูที่คอลัมน์ขนาดสำหรับคำตอบที่คุณสนใจ ค่าอันดับแรกๆ คือขนาดที่บีบอัด ค่าด้านล่างคือขนาดที่บีบอัดแล้ว
โปรดดูเพิ่มเติมที่ลดขนาดและบีบอัดเพย์โหลดของเครือข่าย
คำแนะนำเฉพาะสแต็ก
- Joomla: เปิดใช้การตั้งค่า Gzip Page Compression (ระบบ > การกำหนดค่าส่วนกลาง > เซิร์ฟเวอร์)
- WordPress: เปิดใช้การบีบอัดข้อความในการกำหนดค่าเว็บเซิร์ฟเวอร์