יש להתחבר מראש למקורות נדרשים

בקטע 'הזדמנויות' בדוח Lighthouse מפורטות כל הבקשות העיקריות שעדיין לא נותנים עדיפות לבקשות אחזור באמצעות <link rel=preconnect>:

צילום מסך של &#39;קישור מראש של Lighthouse&#39; לבדיקת המקורות הנדרשים

תאימות דפדפן

<link rel=preconnect> נתמך ברוב הדפדפנים. צפייה תאימות דפדפן.

שיפור מהירות הטעינה של דפים באמצעות התכונה 'חיבור מראש'

כדאי להוסיף רמזים של משאבים מסוג preconnect או dns-prefetch כדי ליצור קשרים מוקדמים למקורות חשובים של צד שלישי.

<link rel="preconnect"> מודיעה לדפדפן שהדף שלך מכוון כדי ליצור חיבור למקור אחר, ושרוצים שהתהליך יתחיל בהקדם האפשרי.

יצירת חיבורים כרוכה בדרך כלל בזמן משמעותי ברשתות איטיות, במיוחד כשמדובר בחיבורים מאובטחים, כי הוא עשוי לכלול חיפושי DNS, הפניות אוטומטיות ומספר בקשות הלוך ושוב לשרת הסופי שמטפל בבקשה של המשתמש.

טיפול מראש בכל הקשור הזה עשוי לגרום לבקשה שלך לפעול במהירות רבה יותר למשתמש בלי להשפיע באופן שלילי על השימוש ברוחב הפס. רוב הזמן ביצירת חיבור הוא המתנה בתור המתנה ולא העברת נתונים.

כדי לעדכן את הדפדפן לגבי הכוונה שלכם צריך פשוט להוסיף תג קישור לדף:

<link rel="preconnect" href="https://example.com">

כך הדפדפן יידע שהדף התכוון כדי להתחבר אל example.com ולאחזר את התוכן משם.

חשוב לזכור שלמרות ש-<link rel="preconnect"> די זול, הוא עדיין עלול לגזול זמן יקר מהמעבד, במיוחד בחיבורים מאובטחים. זה גרוע במיוחד אם לא משתמשים בחיבור תוך 10 שניות, כשהדפדפן סוגר אותו, מבזבז את כל עבודת החיבור המוקדמת.

באופן כללי, אפשר לנסות להשתמש ב-<link rel="preload">, כי מדובר בשינוי מקיף יותר בביצועים, אבל כדאי להשאיר את <link rel="preconnect"> בחגורת הכלים במקרי קצה, כמו:

<link rel="dns-prefetch"> הוא סוג נוסף של <link> שקשור לחיבורים. הוא מטפל רק בחיפוש DNS, אבל הוא כולל תמיכה רחבה יותר בדפדפן, כך שהוא יכול לשמש כחלופה טובה. משתמשים בו בדיוק באותו אופן:

<link rel="dns-prefetch" href="https://example.com" />.

הנחיות ספציפיות למקבץ

Drupal

משתמשים במודול שתומך ברמזים של משאבים של סוכן משתמש כדי שתוכלו להתקין ולהגדיר רמזים של משאבים לקישור מראש או לשליפה מראש של DNS.

Magento

שינוי הפריסה של העיצובים ולהוסיף רמזים של משאבים לקישור מראש או לשליפה מראש של DNS.

משאבים