Images सहसा page वरील सर्वात भारी bytes असतात, त्यामुळे त्या optimize करणे हा सर्वात मोठा LCP उपाय आहे. तीन लीव्हर: modern formats, responsive sizing, आणि loading priority.
AVIF आणि WebP समान quality वर JPEG/PNG पेक्षा खूपच लहान compress होतात (AVIF बहुधा JPEG पेक्षा 50% लहान). जुने browsers अजूनही चालावे यासाठी fallback सह serve करा:
400px phone ला 2000px image पाठवू नका. srcset browser ला device साठी योग्य आकार निवडू देते:
<img
srcset="/p-400.jpg 400w, /p-800.jpg 800w, /p-1600.jpg 1600w"
sizes="(max-width: 600px) 100vw, 800px"
src="/p-800.jpg" width="800" height="600" alt="...">
sizes browser ला image किती रुंद render होते ते सांगते जेणेकरून ते सर्वात लहान पुरेसा source निवडू शकते.
fetchpriority="high", loading="eager", आणि preload चा विचार करा.loading="lazy" जेणेकरून ती गरज पडेपर्यंत fetch होणार नाही.CLS टाळण्यासाठी नेहमी width/height ठेवा.
धीमा LCP बहुतांशी फक्त अवाढव्य hero image असते. formats (AVIF/WebP), योग्य resolution साठी srcset, आणि योग्य priority जाणणे — अधिक LCP image lazy-load न करणे — हे मुलाखतकार अपेक्षित असलेले व्यावहारिक toolkit आहे, आणि तो सहसा वास्तविक site वरील सर्वाधिक प्रभावशाली एकच बदल असतो.
सविस्तर उत्तरांसह IT मुलाखत प्रश्नांचे ग्रंथालय — Junior पासून Senior पर्यंत.
देणगी द्या