Conas a dhéanann tú LCP mall a dhiagnóisiú agus a fheabhsú?

Question

IT Interview Practice · Accepted Answer

Tosaigh trí **cad é an eilimint LCP** agus **cén fáth go bhfuil sé déanach** a fháil amach. Roinneann LCP ina cheithre fho-chuid — ceartaigh an ceann is mó. ## Diagnóis: na ceithre fho-chuid LCP ```text [ TTFB ] ─▶ [ Resource load delay ] ─▶ [ Resource load time ] ─▶ [ Render delay ] server when fetch STARTS download the image paint it ``` Taispeánann Chrome DevTools agus PageSpeed Insights cé acu slisín is mó atá i réim. Coirpigh choitianta: freastalaí mall (TTFB), an íomhá LCP a aimsíodh go déanach, nó script/CSS render-blocking a chuireann moill ar phéinteáil. ## Ceartúcháin de réir fho-chuid - **TTFB mall** → cuir HTML i dtaisce ag CDN, úsáid SSG/ISR, cuir dlús leis an origin/bunachar sonraí. - **Moill lódála (íomhá aimsithe go déanach)** → réamhlódáil é agus ardaigh a thosaíocht ionas go bhfaigheann an brabhsálaí láithreach é in ionad tar éis CSS/JS: ```html

``` - **Am lódála (íomhá rómhór)** → freastail AVIF/WebP, cuir an méid ceart air le `srcset`, comhbhrúigh. - **Moill rindreála** → gearr CSS/JS render-blocking; cuir CSS criticiúil inlíne; `defer` scripteanna. ## Guaiseacha - An íomhá LCP a lazy-load (nó í a cheilt taobh thiar de hidráitiú JS) — an chneá LCP féinghortaithe is uimhir a haon. - Clófhoirne gréasáin ag bacadh an téacs LCP; úsáid `font-display: swap` agus `preload` an chlófhoireann. - LCP saotharlainne a bharrfheabhsú fad is a fhanann fíor-úsáideoirí ar 4G mall — dearbhaigh le sonraí allamuigh i gcónaí. ## Cén fáth a bhfuil sé tábhachtach Is é LCP an mhéadracht lódála ceannlíne agus fachtóir rangaithe cuardaigh. Is é a bheith in ann na ceithre fho-chuid a ainmniú agus gach ceann a mhapáil go ceartúchán nithiúil díreach an cur chuige struchtúrtha, fianaise-thiomáinte a lorgaíonn agallóirí.

Diagnóis: na ceithre fho-chuid LCP

Ceartúcháin de réir fho-chuid

Guaiseacha

Cén fáth a bhfuil sé tábhachtach

Ceisteanna gaolmhara