ความเร็วในการโหลดเว็บไซต์เป็นหัวใจสำคัญของประสบการณ์ผู้ใช้งาน โดยเฉพาะในยุคที่ผู้ใช้งานอินเทอร์เน็ตคาดหวังเว็บที่โหลดเร็วภายในเสี้ยววินาที Cloudflare นำเสนอเทคโนโลยีใหม่ 2 อย่างที่ช่วยลดเวลาโหลดเว็บได้อย่างมีนัยสำคัญ ได้แก่ Early Hints (103) และ HTTP/3 (QUIC) บทความนี้จะอธิบายว่าทั้งสองเทคโนโลยีนี้คืออะไร ทำงานอย่างไร และเปิดใช้งานบน Cloudflare ได้อย่างไร

Early Hints (HTTP 103) คืออะไร?

Early Hints หรือ HTTP Status Code 103 เป็นมาตรฐานใหม่ที่ช่วยให้เบราว์เซอร์เริ่มโหลด Resource สำคัญ เช่น CSS, JavaScript, หรือฟอนต์ ก่อนที่เซิร์ฟเวอร์จะส่ง Response หลัก (200 OK) กลับมา

ปัญหาที่ Early Hints แก้ไข

ปกติเมื่อเบราว์เซอร์ร้องขอหน้าเว็บ จะต้องรอให้เซิร์ฟเวอร์ประมวลผลและส่ง HTML กลับมาก่อน จึงจะรู้ว่าต้องโหลด Resource อะไรบ้าง ในระหว่างนี้เบราว์เซอร์นั่งรอเฉยๆ โดยเสียเวลาโดยไม่จำเป็น

Early Hints แก้ปัญหานี้โดยให้เซิร์ฟเวอร์ (หรือ Cloudflare) ส่ง Header 103 Early Hints พร้อม Link Preload ไปก่อน ในขณะที่ยังประมวลผล Response หลักอยู่ เบราว์เซอร์จึงเริ่มโหลด Resource เหล่านั้นได้ทันที ทำให้ประหยัดเวลาได้หลายร้อยมิลลิวินาที

ประโยชน์ของ Early Hints

• ลด Time to First Byte (TTFB) ที่รับรู้ได้จากฝั่งผู้ใช้
• เริ่มโหลด Critical CSS และ JavaScript ได้เร็วขึ้น
• ปรับปรุง Core Web Vitals โดยเฉพาะ LCP (Largest Contentful Paint)
• ไม่ต้องแก้ไขโค้ดฝั่ง Origin Server

HTTP/3 และ QUIC คืออะไร?

HTTP/3 เป็น Version ล่าสุดของโปรโตคอล HTTP ที่ใช้ QUIC (Quick UDP Internet Connections) แทน TCP แบบเดิม ซึ่งให้ข้อดีหลายประการโดยเฉพาะบนเครือข่ายที่มีความหน่วงสูงหรือไม่เสถียร

ความแตกต่างระหว่าง HTTP/1.1, HTTP/2 และ HTTP/3

ข้อดีสำคัญของ HTTP/3

• 0-RTT Connection: การเชื่อมต่อครั้งถัดไปไม่ต้อง Handshake ใหม่ ลดความหน่วงได้มาก
• ไม่มี Head-of-Line Blocking: แต่ละ Stream เป็นอิสระจากกัน แม้แพ็กเก็ตหนึ่งหายไป Stream อื่นยังทำงานต่อได้
• Connection Migration: เมื่อเปลี่ยน IP (เช่น สลับจาก WiFi เป็น 4G) การเชื่อมต่อยังคงอยู่ได้โดยไม่ต้อง Reconnect
• เร็วขึ้นบนเครือข่ายไม่เสถียร: เหมาะมากสำหรับผู้ใช้งาน Mobile ที่สัญญาณขึ้นลง

วิธีเปิดใช้งาน Early Hints บน Cloudflare

Cloudflare รองรับ Early Hints และเปิดใช้งานได้ง่ายผ่าน Dashboard

ขั้นตอนการเปิด Early Hints

1. เข้าสู่ Cloudflare Dashboard และเลือก Domain ที่ต้องการ
2. ไปที่เมนู Speed → Optimization
3. เลื่อนหา Early Hints
4. คลิก Toggle เพื่อเปิดใช้งาน

เมื่อเปิดแล้ว Cloudflare จะอ่าน Link Header จาก Response ของ Origin Server (หรือจาก Cache) และส่ง 103 Early Hints ไปยังเบราว์เซอร์โดยอัตโนมัติ

เพิ่ม Link Header บน Origin Server

เพื่อให้ Cloudflare รู้ว่าควรส่ง Resource ใดเป็น Early Hints ให้เพิ่ม Link Header บน Origin Server เช่น บน Nginx:

# nginx.conf
add_header Link "</css/style.css>; rel=preload; as=style";
add_header Link "</js/main.js>; rel=preload; as=script";
add_header Link "<https://fonts.googleapis.com/css2?family=Sarabun>; rel=preconnect";

สำหรับผู้ใช้ WordPress บน VPS สามารถเพิ่ม Header ผ่าน Plugin เช่น HTTP Headers หรือแก้ไขไฟล์ .htaccess (Apache) หรือ nginx.conf ได้โดยตรง

วิธีเปิดใช้งาน HTTP/3 บน Cloudflare

HTTP/3 บน Cloudflare เปิดใช้งานง่ายมากและรองรับทุก Plan

ขั้นตอนการเปิด HTTP/3

1. ใน Cloudflare Dashboard เลือก Domain
2. ไปที่เมนู Network
3. หา HTTP/3 (with QUIC)
4. เปิด Toggle

เพียงเท่านี้ Cloudflare จะรองรับการเชื่อมต่อแบบ HTTP/3 สำหรับเบราว์เซอร์ที่รองรับ (Chrome, Firefox, Edge, Safari ล่าสุดทั้งหมดรองรับแล้ว) โดยเบราว์เซอร์ที่ไม่รองรับจะใช้ HTTP/2 แทนโดยอัตโนมัติ

ตรวจสอบว่าเว็บใช้ HTTP/3 จริงหรือไม่

สามารถตรวจสอบได้หลายวิธี:

• Chrome DevTools: เปิด Network Tab → คลิกขวาที่ Column Header → เพิ่มคอลัมน์ “Protocol” จะเห็น h3 สำหรับ HTTP/3
• curl: curl -I --http3 https://yourdomain.com
• Online Tool: ใช้ https://http3check.net/ กรอก URL เพื่อตรวจสอบ

Early Hints และ HTTP/3 กับ VPS

สำหรับผู้ที่ใช้งาน VPS ร่วมกับ Cloudflare การเปิดใช้ทั้งสองฟีเจอร์นี้จะให้ประสิทธิภาพสูงสุด เพราะ:

• VPS มี Network ความเร็วสูง ทำให้ Origin Response เร็ว Cloudflare สามารถ Cache และส่ง Early Hints ได้ทันที
• HTTP/3 ช่วยผู้เยี่ยมชมที่ใช้ Mobile หรือเครือข่ายไม่เสถียรเข้าถึงเว็บได้รวดเร็วขึ้น
• ลด Load บน VPS เพราะ Cloudflare จัดการ Connection overhead แทน
• รองรับทั้งเว็บไซต์ภาษาไทยที่มีฟอนต์หนัก และ E-Commerce ที่โหลด Script เยอะ

แนะนำการตั้งค่าร่วมกัน

ข้อจำกัดและสิ่งที่ควรรู้

Early Hints

• ต้องใช้ HTTPS เท่านั้น (HTTP ไม่รองรับ)
• Cloudflare จะส่ง Early Hints เฉพาะเมื่อมี Link Header จาก Origin หรือจาก Cache Hit
• เบราว์เซอร์เก่า (IE, เก่ามาก) ไม่รองรับ แต่จะ Fallback เป็นพฤติกรรมปกติ ไม่มีผลเสีย
• ปัจจุบัน Cloudflare รองรับ Early Hints แบบ Cache-Aware ซึ่งดีกว่า Static Link Header

HTTP/3

• ต้องการ UDP Port 443 ไม่ถูก Firewall บล็อก ในบางเครือข่ายองค์กรที่ปิด UDP อาจไม่ทำงาน
• Cloudflare จัดการการ Negotiate Protocol ให้อัตโนมัติ เบราว์เซอร์ที่ไม่รองรับ HTTP/3 จะใช้ HTTP/2 แทน
• ไม่ต้องแก้ไขอะไรบน Origin Server เพราะ Cloudflare เป็น Termination Point

สรุป

Early Hints และ HTTP/3 เป็นเทคโนโลยีที่เปิดใช้งานง่ายบน Cloudflare แต่ให้ผลลัพธ์ด้านความเร็วที่ชัดเจน โดยเฉพาะสำหรับเว็บไซต์ที่มีผู้เข้าชมจากมือถือหรือเครือข่ายที่หลากหลาย

สำหรับผู้ที่ต้องการประสิทธิภาพสูงสุด ลองพิจารณาใช้ VPS ร่วมกับ Cloudflare เพื่อได้ทั้ง Origin Server ที่เร็ว และ CDN ที่ทรงพลัง ควบคู่กับฟีเจอร์ Early Hints และ HTTP/3 ที่ช่วยให้เว็บโหลดเร็วยิ่งขึ้นไปอีกระดับ