Resource hints یہ <link> tags ہیں جو براؤزر کو وسائل (resources) کو جلدی حاصل کرنے یا ان سے connect کرنے کے لیے کہتے ہیں، اور یہ load کی کارکردگی کو بہتر بناتے ہیں۔ ہر ایک مختلف timing/priority کی ضرورت کے لیے کام کرتا ہے۔
Resource hints یہ <link> tags ہیں جو براؤزر کو وسائل (resources) کو جلدی حاصل کرنے یا ان سے connect کرنے کے لیے کہتے ہیں، اور یہ load کی کارکردگی کو بہتر بناتے ہیں۔ ہر ایک مختلف timing/priority کی ضرورت کے لیے کام کرتا ہے۔
preload — "مجھے یہ موجودہ صفحہ کے لیے درکار ہے، اسے ابھی high priority میں حاصل کریں۔" Critical وسائل کے لیے جو parser کو دیر سے معلوم ہوں: fonts، hero images، CSS-referenced assets۔ as کی ضرورت ہے تاکہ براؤزر صحیح priority/headers سیٹ کرے۔
preconnect — "میں اس origin سے جلد ہی connect کروں گا؛ DNS lookup + TCP + TLS handshake ابھی کریں۔" تیسری طرف (third-party) کی پہلی request سے پہلے round-trips کو بچاتا ہے (API، font host، CDN)۔ کچھ critical origins کے لیے استعمال کریں۔
dns-prefetch — preconnect کا ہلکا ورژن: صرف DNS resolution۔ اچھا fallback / بہت سے origins کے لیے۔
prefetch — "مجھے یہ شاید اگلی navigation کے لیے درکار ہوگا؛ اسے low priority میں fetch کریں جب فارغ ہو۔" ممکنہ اگلے صفحات/وسائل کے لیے۔ موجودہ صفحہ کے لیے نہیں، مستقبل کے لیے cached۔
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="preload" href="/fonts/inter.woff2" as="font" type="font/woff2" crossorigin />
Fonts کو دیر سے دریافت کیا جاتا ہے (براؤزر کو پہلے CSS parse کرنا ہوگا)، اس لیے انہیں preload کرنا غیر مرئی-متن کی تاخیر سے بچاتا ہے۔
ہر چیز کو preload کرنا مقصد کو ختم کر دیتا ہے — یہ حقیقی طور پر critical وسائل کے ساتھ bandwidth کے لیے مقابلہ کرتا ہے۔ صرف وہی کچھ hint کریں جو سب سے زیادہ اہم ہوں۔
Resource hints critical path سے latency کو ختم کرتے ہیں: preconnect تیسری فریقین (third parties) کے لیے handshake کی تاخیر کو ہٹاتا ہے، preload دیر سے دریافت شدہ critical assets (fonts، LCP image) کو ترجیح دیتا ہے، اور prefetch اگلی navigation کو فوری محسوس کرتا ہے۔
اگر سراج نسخت استعمال کریں تو وہ Core Web Vitals میں معنی خیز بہتری لاتے ہیں۔