ความหมาย
การตอบกลับชั่วคราวที่ส่ง header Link มาก่อน เพื่อให้เบราว์เซอร์โหลด CSS ฟอนต์ หรือเชื่อมต่อกับ origin ล่วงหน้าได้ ระหว่างที่เซิร์ฟเวอร์ยังสร้างหน้าสุดท้ายอยู่
สาเหตุที่พบบ่อย
- CDN อย่าง Cloudflare หรือ Fastly ส่ง Early Hints สำหรับ header Link ที่แคชไว้
- เซิร์ฟเวอร์แอปส่ง 103 ก่อนการเรนเดอร์ที่ช้า
วิธีแก้ไข
สำหรับไคลเอนต์หรือผู้เยี่ยมชม
ไม่ต้องทำอะไร เบราว์เซอร์ที่รองรับจะเริ่มโหลดล่วงหน้าแล้วใช้การตอบกลับสุดท้าย ไคลเอนต์ที่ไม่เข้าใจ 103 ก็แค่ละเลยไป
สำหรับผู้ดูแลเว็บไซต์หรือ API
ส่งเฉพาะ resource ที่หน้าสุดท้ายใช้จริง และให้คำใบ้ตรงกับ header Link ของการตอบกลับ 200 เพื่อไม่ให้ดาวน์โหลดเสียเปล่า
ตัวอย่างการตอบกลับ
HTTP/1.1
HTTP/1.1 103 Early Hints
Link: </styles/main.css>; rel=preload; as=style
Link: <https://cdn.example.com>; rel=preconnectข้อกำหนด
คำถามที่พบบ่อย
› เบราว์เซอร์ใดรองรับ 103 Early Hints
Chrome, Edge, Firefox และ Safari รองรับคำใบ้ preload และ preconnect จาก 103 ผ่าน HTTP/2 และ HTTP/3
› 103 ช่วยปรับปรุง Core Web Vitals ไหม
ช่วยปรับปรุง LCP และ FCP ได้เมื่อเซิร์ฟเวอร์ใช้เวลาประมวลผลนาน เพราะ asset สำคัญถูกดาวน์โหลดระหว่างรอ