حلّ مقياس INP محل FID منذ أكثر من عام، وما زالت معظم الفرق الهندسية بلا خطة عمل واضحة له. هذا ما نوصي به في كل مشروع نسلّمه.
ابدأ بالميزانية. نعامل 2.0 ثانية لمقياس LCP، و0.05 لمقياس CLS، و200 مللي ثانية لمقياس INP بوصفها حدودًا صارمة. إن أخفقت صفحة في أيٍّ منها في الاختبارات المعملية، لا يُدمج طلب التغيير. هذا ليس طموحًا، بل فحص آلي في خط التكامل المستمر.
في LCP، أكبر رافعة منفردة هي الصورة الرئيسية أعلى الصفحة. استخدم صيغة AVIF، وحدّد أبعادها صراحةً، وعلّمها بخاصية priority، وقدّمها من شبكة توصيل محتوى (CDN) بتخزين مؤقت سليم. وإن كانت نصًّا فقط، فاعرضها من الخادم وانتهى الأمر.
في CLS، ثبّت أبعاد كل صورة وفيديو وعنصر مضمَّن. احجز مساحة للإعلانات والوحدات التي تُحمَّل لاحقًا. ولا تُدرج خطوط ويب تتبدل في منتصف العرض ما لم تكن قد ضبطت مقاس الخط البديل ليطابقها.
في INP، العمل أقل ارتباطًا بالسرعة المطلقة وأكثر ارتباطًا بالمهام الطويلة التي تحجز الخيط الرئيسي. راجع حزمة الشيفرة. قسّم المكونات الثقيلة. أجّل مكتبات الحركة حتى تُحتاج. وانقل منطق التحليل الثقيل إلى Web Worker إن أمكن.
قِس على أجهزة حقيقية. أرقام المختبر وأرقام الميدان تروي قصتين مختلفتين، ويجب أن يكون تقرير تجربة مستخدمي Chrome (CrUX) مرجعك، لا تشغيل Lighthouse على جهازك.
كتبه فريق brainiac/studio. ننشر عملًا أصليًا من المهندسين والمصممين والمسوّقين الذين يقومون بالعمل نفسه، ولا نُسند الكتابة إلى جهة خارجية.