ส่วนโอกาสของรายงาน Lighthouse จะแสดงรายการคำขอที่สำคัญทั้งหมด
ที่ยังไม่ได้ให้ความสำคัญกับคำขอดึงข้อมูลกับ <link rel=preconnect>:
ความเข้ากันได้กับเบราว์เซอร์
เบราว์เซอร์ส่วนใหญ่รองรับ <link rel=preconnect> โปรดดู
ความเข้ากันได้กับเบราว์เซอร์
ปรับปรุงความเร็วในการโหลดหน้าเว็บด้วยการเชื่อมต่อล่วงหน้า
ลองเพิ่มคำแนะนำด้านทรัพยากร preconnect หรือ dns-prefetch
เพื่อสร้างการเชื่อมต่อกับต้นทางที่สำคัญของบุคคลที่สามตั้งแต่เนิ่นๆ
<link rel="preconnect"> แจ้งเบราว์เซอร์ว่าหน้าเว็บต้องการให้
เพื่อสร้างการเชื่อมต่อกับต้นทางอื่น
และคุณต้องการให้กระบวนการเริ่มต้นโดยเร็วที่สุด
การสร้างการเชื่อมต่อมักใช้เวลานานมากในเครือข่ายที่ช้า โดยเฉพาะอย่างยิ่งสำหรับการเชื่อมต่อที่ปลอดภัย เพราะอาจต้องมีการค้นหา DNS การเปลี่ยนเส้นทาง และการเดินทางไป-กลับหลายครั้งไปยังเซิร์ฟเวอร์สุดท้ายที่จัดการคำขอของผู้ใช้
การจัดการทั้งหมดนี้ล่วงหน้าช่วยให้แอปพลิเคชันของคุณดำเนินไปได้อย่างรวดเร็วยิ่งขึ้น ให้กับผู้ใช้โดยไม่ส่งผลเสียต่อการใช้แบนด์วิดท์ เวลาส่วนใหญ่ในการสร้างการเชื่อมต่อจะรอนานกว่าการแลกเปลี่ยนข้อมูล
การแจ้งให้เบราว์เซอร์ทราบถึงเจตนาของคุณนั้นทำได้ง่ายๆ เพียงเพิ่มแท็กลิงก์ลงในหน้าเว็บของคุณ
<link rel="preconnect" href="https://example.com">
ซึ่งจะช่วยให้เบราว์เซอร์ทราบว่าหน้าเว็บ
เพื่อเชื่อมต่อกับ example.com และเรียกดูเนื้อหาจากที่นั่น
โปรดทราบว่าแม้ว่า <link rel="preconnect"> จะมีราคาถูก
แต่ก็อาจต้องใช้เวลา CPU ที่มีค่ามาก โดยเฉพาะการเชื่อมต่อที่ปลอดภัย
ซึ่งจะแย่มากหากไม่ได้ใช้งานการเชื่อมต่อภายใน 10 วินาที
ขณะที่เบราว์เซอร์ปิดลง ทำให้สูญเสียการทำงานในช่วงแรกๆ ของการเชื่อมต่อทั้งหมด
โดยทั่วไปแล้ว
ลองใช้ <link rel="preload">
เนื่องจากเป็นการปรับเปลี่ยนประสิทธิภาพ
ที่ครอบคลุมมากขึ้น
แต่ให้เก็บ <link rel="preconnect"> ไว้ในสายเครื่องมือเผื่อไว้ในกรณีพิเศษ เช่น
<link rel="dns-prefetch"> เป็น<link>อีกประเภทที่เกี่ยวข้องกับการเชื่อมต่อ
การดำเนินการนี้จะจัดการเฉพาะการค้นหา DNS เท่านั้น
แต่ก็สามารถรองรับเบราว์เซอร์ได้กว้างกว่า ดังนั้นเบราว์เซอร์นี้จึงอาจทำงานสำรองได้ดี
โดยคุณใช้วิธีนี้ในลักษณะเดียวกัน:
<link rel="dns-prefetch" href="https://example.com" />.
คำแนะนำเฉพาะสแต็ก
Drupal
ใช้โมดูลที่รองรับคำแนะนำด้านทรัพยากร User Agent เพื่อให้ติดตั้งและกำหนดค่าการเชื่อมต่อล่วงหน้าได้ หรือดึงข้อมูลคำแนะนำด้านทรัพยากรของ DNS ล่วงหน้า
Magento
แก้ไขเลย์เอาต์ของธีม และเพิ่มการเชื่อมต่อล่วงหน้าหรือ DNS เพื่อดึงข้อมูลคำแนะนำเกี่ยวกับทรัพยากรล่วงหน้า