Lazy-loading nundha ngundhuh sesuatu nganti pancen dibutuhake — biasane pas arep scroll mlebu tampilan. Iki ngecilake payload awal saengga bagean kaca sing katon dimuat luwih cepet.
Browser nindakake iki kanthi native mung nganggo siji atribut:
Tansah simpen width/height supaya browser nyadhangi papan (ngindhari layout shift). Aja nate nge-lazy-load gambar LCP sampeyan — iku nundha barang sing lagi diukur.
Pisahake UI sing abot utawa arang dienggo (modal, chart) dadi chunk kapisah sing dimuat nalika dibutuhake:
// Instead of a static import that ships in the main bundle:
const Chart = React.lazy(() => import("./Chart")); // separate chunk, fetched when rendered
<Suspense fallback={<Spinner />}>
<Chart data={data} />
</Suspense>
import() dinamis ngandhani bundler kanggo nggawe file kapisah sing mung diundhuh nalika <Chart> pisanan di-render.
Lazy-loading iku kamenangan sing paling prasaja lan paling akeh manfaate kanggo kaca sing abot: luwih sithik sing diundhuh ing wiwitan tegese LCP luwih cepet lan luwih sithik JS sing diparse. Pewawancara kepengin ndeleng sampeyan ora nge-lazy-load gambar hero — kesalahan klasik sing ngrusak metrik sing arep sampeyan bantu.
Pustaka pitakon wawancara IT kanthi jawaban rinci — saka Junior nganti Senior.
Nyumbang