हालाँकि हर किसी का लक्ष्य वेब प्रदर्शन बजट को कम करना है, फिर भी तीसरे पक्ष की सेवाओं का उपयोग करना आवश्यक है। इन सेवाओं का उपयोग करते समय, "डीएनएस लुकअप" सेवाओं की संख्या के आधार पर, कई बार बजट का एक महत्वपूर्ण हिस्सा खर्च हो सकता है। ये लोड पेज की गति के विभिन्न पहलुओं को प्रभावित करते हैं, जिसमें फर्स्ट कंटेंटफुल पेंट (FCP) भी शामिल है।
इन दो अवधारणाओं का उद्देश्य तीसरे पक्ष के कनेक्शन समय को अनुकूलित करना है। इन दो अवधारणाओं के बीच अंतर को समझने से पहले, यह समझना आवश्यक है कि जब कोई तृतीय-पक्ष अनुरोध किया जाता है तो वास्तव में क्या होता है:
- आईपी पता प्राप्त करने के लिए डोमेन का समाधान किया जाता है।
- सर्वर के साथ कनेक्शन स्थापित हो गया है।
- सुरक्षा सुनिश्चित करने के लिए कनेक्शन एन्क्रिप्टेड है।
यह पदानुक्रम प्रत्येक तृतीय-पक्ष कनेक्शन के लिए दोहराया जाता है। यहीं पर प्रीकनेक्ट और डीएनएस-प्रीफ़ेच के बीच का अंतर सामने आता है।
- प्रीकनेक्ट: यह सुनिश्चित करता है कि ऊपर वर्णित सभी तीन चरण पूर्व-कॉन्फ़िगर किए गए हैं।
- DNS-प्रीफ़ेच: पहले चरण में केवल डोमेन नाम को आईपी पते में परिवर्तित करने का काम करता है।
जैसा कि आप देख सकते हैं, प्रीकनेक्ट अधिक व्यापक और लाभकारी है। हालाँकि, हर चीज़ की एक कीमत होती है। अपने सभी कनेक्शन के लिए प्रीकनेक्ट का उपयोग करने से आपके पेज के अनुकूलन पर नकारात्मक प्रभाव पड़ सकता है। इसलिए, आपआपको केवल महत्वपूर्ण कनेक्शनों के लिए preconnect का उपयोग करना चाहिए और अन्य सभी तृतीय-पक्ष कनेक्शनों के लिए dns-prefetch का उपयोग करना चाहिए.
उपयोग का सारांश
उपरोक्त जानकारी के आधार पर, उनके उपयोग का संक्षिप्त सारांश इस प्रकार है:
<link rel="preconnect" href="https://third-party-example.com">
<link rel="dns-prefetch" href="https://third-party-example.com">ब्राउज़र संगतता
उनके उपयोग पर चर्चा करते समय, ब्राउज़र संगतता का उल्लेख करना भी महत्वपूर्ण है। ये दो निकट से संबंधित अवधारणाएँ आधुनिक ब्राउज़रों द्वारा व्यापक रूप से समर्थित हैं, लेकिन उनका उपयोग पूरी तरह से ओवरलैप नहीं होता है। प्रीकनेक्ट लगभग 97% ब्राउज़रों द्वारा समर्थित है, जबकि डीएनएस-प्रीफ़ेच को 83% ब्राउज़रों द्वारा समर्थित किया गया है (जून 2024 तक).
वेब प्रदर्शन बजट में योगदान
- प्रीकनेक्ट कुल गति सुधार प्रदान कर सकता है 100-500ms.
- DNS-प्रीफ़ेच प्रत्येक कनेक्शन को तेज़ कर सकता है 20-120ms.
हम अधिक संतोषजनक स्थानीय उदाहरण उपलब्ध कराने के लिए स्वयं परीक्षण करने की योजना बना रहे हैं।
अंत में, मैं सेयहुन एनकी अक्सन के ब्लॉग की अनुशंसा और श्रेय देना चाहूँगा, जिसने इस लेख को तैयार करते समय मेरी समझ में बहुत योगदान दिया: सेयहुन एनकी अक्सान का ब्लॉग.
