రిసోర్స్ హింట్లు <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 ను అర్థవంతంగా మెరుగుపరుస్తాయి.