आपके लाइटहाउस रिपोर्ट के ऑपर्च्यूनिटी सेक्शन में, उन सभी मुख्य अनुरोधों की सूची होती है
जिन्होंने अभी तक <link rel=preconnect> के साथ, फ़ेच करने के अनुरोधों को प्राथमिकता नहीं दी है:
ब्राउज़र के साथ काम करना
<link rel=preconnect> ज़्यादातर ब्राउज़र पर काम करता है. अलग-अलग ब्राउज़र पर साइट की जांच करना देखें.
पहले से कनेक्ट करने की सुविधा की मदद से, पेज लोड होने की स्पीड को बेहतर बनाएं
तीसरे पक्ष के ज़रूरी ऑरिजिन के साथ पहले से कनेक्शन बनाने के लिए, preconnect या dns-prefetch रिसॉर्स हिंट जोड़ें.
<link rel="preconnect">, ब्राउज़र को यह जानकारी देता है कि आपका पेज किसी दूसरे ऑरिजिन से कनेक्ट करना चाहता है और आपको इस प्रोसेस को जल्द से जल्द शुरू करना है.
कनेक्शन बनाने में अक्सर धीमे नेटवर्क में काफ़ी समय लगता है, खास तौर पर, जब बात सुरक्षित कनेक्शन की हो. इसमें डीएनएस लुकअप, रीडायरेक्ट, और उपयोगकर्ता के अनुरोध को हैंडल करने वाले फ़ाइनल सर्वर पर कई राउंड ट्रिप शामिल हो सकती हैं.
इन सभी बातों का ध्यान पहले से रखने पर, उपयोगकर्ता को आपका ऐप्लिकेशन ज़्यादा तेज़ लग सकता है. साथ ही, बैंडविड्थ के इस्तेमाल पर भी इसका बुरा असर नहीं पड़ेगा. कनेक्शन बनाने में ज़्यादातर समय, डेटा एक्सचेंज करने के बजाय इंतज़ार में बीत जाता है.
ब्राउज़र को अपने मकसद के बारे में जानकारी देना, अपने पेज पर लिंक टैग जोड़ने जितना आसान है:
<link rel="preconnect" href="https://example.com">
इससे ब्राउज़र को पता चलता है कि पेज का मकसद example.com से कनेक्ट करना और वहां से कॉन्टेंट हासिल करना है.
ध्यान रखें कि <link rel="preconnect"> काफ़ी सस्ता होने के बावजूद,
इसमें सीपीयू का बहुत ज़्यादा समय लग सकता है. खास तौर पर, सुरक्षित कनेक्शन पर.
यह खास तौर पर तब खराब होता है, जब कनेक्शन का इस्तेमाल 10 सेकंड के अंदर न किया गया हो. ऐसा होने पर, ब्राउज़र उसे बंद कर देता है और कनेक्शन से जुड़ी सारी प्रोसेस बेकार हो जाती है.
आम तौर पर, <link rel="preload"> का इस्तेमाल करें, क्योंकि यह परफ़ॉर्मेंस में ज़्यादा बदलाव करता है. हालांकि, कुछ खास मामलों में <link rel="preconnect"> का इस्तेमाल करें, जैसे:
- इस्तेमाल का उदाहरण: यह जानना कि डेटा कहां से फ़ेच किया जा रहा है, लेकिन यह नहीं कि क्या फ़ेच किया जा रहा है
- इस्तेमाल का उदाहरण: स्ट्रीमिंग मीडिया
<link rel="dns-prefetch">, कनेक्शन से जुड़ा एक और <link> टाइप है.
यह सिर्फ़ डीएनएस लुकअप को हैंडल करता है,
लेकिन इसे ब्राउज़र के लिए ज़्यादा सपोर्ट मिला है. इसलिए, यह एक अच्छा फ़ॉलबैक का काम कर सकता है.
इसका इस्तेमाल ठीक उसी तरह किया जाता है:
<link rel="dns-prefetch" href="https://example.com" />.
स्टैक के हिसाब से दिशा-निर्देश
Drupal
Preconnect या dns-prefetch रिसॉर्स संकेत जोड़े जा सकते हैं. ऐसा मॉड्यूल को इंस्टॉल और कॉन्फ़िगर करके किया जा सकता है जो उपयोगकर्ता एजेंट संसाधन संकेत के लिए सुविधाएं उपलब्ध कराता है.
Magento
अपनी थीम के लेआउट में बदलाव करें और प्रीकनेक्ट या डीएनएस प्रीफ़ेच संसाधन के संकेत जोड़ें.