संसाधन सूचनांमध्ये <link> टॅग आहेत जे ब्राउজरला संसाधने लवकर मिळवण्यास किंवा कनेक्ट करण्यास सांगतात, लोड करण्याची कार्यक्षमता सुधारतात. प्रत्येक अलग वेळ / प्राधान्य आवश्यकता पूरण करतो.
संसाधन सूचनांमध्ये <link> टॅग आहेत जे ब्राउজरला संसाधने लवकर मिळवण्यास किंवा कनेक्ट करण्यास सांगतात, लोड करण्याची कार्यक्षमता सुधारतात. प्रत्येक अलग वेळ / प्राधान्य आवश्यकता पूरण करतो.
preload — "मला हे वर्तमान पृष्ठासाठी लाग्यार्थ, आता उच्च प्राधान्यसह मिळवा." महत्वपूर्ण संसाधनांसाठी जे पार्सर देरीने शोधून काढतो: फॉन्ट, हीरो प्रतिमा, CSS-संदर्भित मालमत्ता. as आवश्यक आहे जेणेकरून ब्राउজर योग्य प्राधान्य / हेडर सेट करेल.
preconnect — "मी लवकरच या उत्पत्तीला कनेक्ट होईल; DNS लुकअप + TCP + TLS हँडशेक आता करा." तृतीय पक्षाला (API, फॉन्ट होस्ट, CDN) पहिल्या विनंतीपूर्वी गोलाकार प्रवास वाचवा. काही महत्वपूर्ण उत्पत्तीसाठी वापरा.
dns-prefetch — preconnect चा हल्का आवृत्ती: केवळ DNS निराकरण. अनेक उत्पत्तीसाठी चांगली फॉलबॅक /.
prefetch — "मला हे खरोखर पुढील नेव्हिगेशनसाठी लाग्यार्थ; विनाव्यस्त असताना कमी प्राधान्यसह मिळवा." संभाव्य-पुढील पृष्ठ / मालमत्तेसाठी. वर्तमान पृष्ठासाठी नाही, भविष्यातसाठी कॅश केले जाते.
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="preload" href="/fonts/inter.woff2" as="font" type="font/woff2" crossorigin />
फॉन्ट देरीने शोधून काढले जातात (ब्राउজरला प्रथम CSS पार्स करावे लागते), म्हणून त्यांना पूर्वलोड केल्याने अदृश्य-मजकूर विलंब टाळणे शक्य होते.
सर्व काही पूर्वलोड केल्याने हेतू निष्फळ होतो — वास्तविक महत्वपूर्ण संसाधनांसह बँडविड्थसाठी स्पर्धा केली जाते. केवळ सर्वात महत्वपूर्ण काहीसाठी सूचना वापरा.
संसाधन सूचना गंभीर मार्गावरील विलंब कमी करतात: preconnect तृतीय पक्षासाठी हँडशेक विलंब हटवतो, preload देरीने-शोधलेल्या महत्वपूर्ण मालमत्तेला (फॉन्ट, LCP प्रतिमा) प्राधान्य देतो, आणि prefetch पुढील नेव्हिगेशन तात्क्षणिक वाटतो करतो.
शस्त्रास्त्र वापरून, Core Web Vitals अर्थपूर्ण प्रकारे सुधारतात.