# संसाधन संकेत और पूर्वलोडिंग — वेब प्रदर्शन अनुकूलन

Source: https://www.skillbyai.com/hi/web-performance/web-perf-19

> संसाधन लोडिंग अनुकूलित करने के लिए संसाधन संकेतों का उपयोग करें।

## Preload, prefetch और preconnect

`<link rel=preload as=script href=critical.js>` resource को तुरंत load करता है। `<link rel=prefetch href=next-page.js>` idle समय में load करता है। `<link rel=preconnect href=cdn.example.com>` connection पहले से खोल देता है। Preload सिर्फ़ सच में critical resources के लिए इस्तेमाल करें।

## DNS prefetch अनुकूलन

DNS lookup में 20-120ms लगते हैं। Third-party domains के लिए `<link rel=dns-prefetch href=//cdn.example.com>` इस्तेमाल करें। आगे के connections की latency घटती है। पूरे handshake के लिए preconnect के साथ जोड़ें।

## संसाधन संकेत रणनीति

प्राथमिकता: third-party origins पर preconnect, critical resources का preload, संभावित अगले pages का prefetch। बहुत ज़्यादा hints उल्टा नुकसान कर सकते हैं। RUM से असर मापें।

त्वरित जाँच

**Quiz:** preconnect क्या करता है?

- [ ] संसाधन को तुरंत लोड करता है
- [ ] कनेक्शन को अक्षम करता है
- [ ] Page script download और execute करता है
- [x] तीसरे पक्ष के सर्वर के लिए प्रारंभिक कनेक्शन खोलता है

*Answer:* तीसरे पक्ष के सर्वर के लिए प्रारंभिक कनेक्शन खोलता है. preconnect DNS, TCP और TLS का काम पहले कर देता है ताकि बाद की requests तेज़ शुरू हों।