LCP؛ محتوای اصلی چه زمانی دیده میشود؟
LCP یکی از شاخصهای تجربه بارگذاری است و معمولاً تصویر یا محتوای اصلی بالای صفحه روی آن اثر دارد. حجم تصویر، CSS مسدودکننده و پاسخ سرور را باید جداگانه بررسی کرد.
INP؛ صفحه چقدر سریع به تعامل پاسخ میدهد؟
اسکریپتهای زیاد، eventهای سنگین و کارهای طولانی روی thread اصلی میتوانند تعامل را کند کنند. JavaScript باید فقط جایی اجرا شود که ارزش واقعی دارد.
CLS؛ چرا صفحه ناگهان میپرد؟
نبودن اندازه مشخص برای تصاویر، تبلیغات یا عناصر دیرلودشونده میتواند باعث جابهجایی layout شود. برای تصاویر width و height مشخص کنید و فضای لازم را از ابتدا رزرو کنید.
افکت زیاد، الزاماً سایت حرفهای نیست
blur، backdrop-filter، shadowهای بزرگ و transformهای دائمی اگر روی عناصر زیاد استفاده شوند، مخصوصاً روی موبایل، هزینه rendering را بالا میبرند. افکت باید هدف داشته باشد.
پنج کار کمریسک و پُربازده
✓تصاویر WebP/AVIF و اندازه متناسب
✓کاهش اسکریپت و اجرای defer برای JS غیرضروری
✓فونت محلی یا fallback مناسب
✓رزرو فضای تصاویر و عناصر پویا برای کنترل CLS
✓تست واقعی موبایل، نه فقط دسکتاپ
سایت شما کند است؟
صفحه طراحی سایت نیوتکنو را ببینید.