Cad a bhí i gceist ag resource hints cosúil le preload, prefetch agus preconnect?

Question

Accepted Answer

Is iad **resource hints** ná canna `` a insíonn don bhrabhsálaí acmhainní a fhéachaint nó a chur ar fáil go luath, ag optamhachtáil feidhmíochta an ualaigh. Feidhmíonn gach ceann ar dhéanamh difriúil am/tosaigh. ```html ``` ## Cad a dhéanann gach ceann - **`preload`** — "Tá an **don leathanach reatha** seo de dhíth orm, faigh anois é ar thosaigh ard." Do acmhainní criticiúla a aimsíonn an parsálaí go mall: cló-bhailí, íomhánna laochra, acmhainní atá tagartha ag CSS. Éilíonn `as` go socrófar an tosaigh/na ceanntáisc ceart ag an mbrabhsálaí. - **`preconnect`** — "Ceangóbhaidh mé don **fhoinse** seo go gairid; déan an réiteach DNS + TCP + an lamhdhéanamh TLS anois." Sábhálann sé na bhfillteach sula bhfaigheann tú an chéad iarratas chuig páirtí tríú páirtí (API, óstach cló, CDN). Úsáid do roinnt foinseanna criticiúla. - **`dns-prefetch`** — leagan níos éadroime de preconnect: an réiteach DNS amháin. Faillbheart maith / do go leor foinseanna. - **`prefetch`** — "Beidh an **dhóchúil** seo agam don **chéad navigation eile** amach anseo; faigh ag íseal-tosaigh nuair a bhíonn tú gan ghníomhaíochta." Do leathanaigh/acmhainní atá dóchúil a bheith ag teastáil ó shin. Stóráilte i taisce don todhchaí, ní an leathanach reatha. ## Sampla fíor-choiteann: cló-bhailí ```html ``` Taistear cló-bhailí go mall (caithfidh an brabhsálaí CSS a phársáil ar dtús), agus dá bhrí sin, is féidir a bheith ag foluain texta neamhinfheidhmithe a sheachaint. ## Rabhadh: ná thabhairt barraigead treorach Ní bhí préamhloada ar gach rud - chuirtear ar cealg an sprioc - agus idir é agus na hacmhainní go fíor-chriticiúil chun an bandaleithead a roinnt. Ní thabhairt oiread treorach ach do na cúpla ceann is tábhachtaí. ## Cén fáth a bhí sé i gceist Déanann resource hints laghdú ar an latency ar an chonair chriticiúil: cuireann `preconnect` deireadh an deis dé-shiombail do thrí páirtí, tugann `preload` tosaigh do acmhainní criticiúla a aimsítear go mall (cló-bhailí, íomhá LCP), agus déanann `prefetch` an *navigation eile* a bhraith ar an toirt. Usáidte go geal, feabhsaíonn siad na Core Web Vitals go suntasach.