قياس سرعة استجابة صفحات الويب : سرعة الإستجابة لكل تفاعل على الصفحة (INP)
في المجال الطبي ، vitals هي المقاييس الحيوية الخاصة بالإنسان مثل ضغط الدم. أما في مجال الويب والمواقع الإلكترونية نستخدم نفس الفكرة والمصطلحات. تجدنا نستخدم core web vitals ومعناها المقاييس الحيوية الأساسية للويب أو بإختصار vitals ومعناها المقاييس الحيوية.
الـ Core Web Vitals به الكثير من المقاييس الحيوية للمواقع الإلكترونية مثل أول عملية ظهور لشكل وتُتخصر كـ FCP ، وأكبر عملية ظهور للشكل LCP ، وإجمالي الوقت المستغرق قبل استعداد الصفحة للتفاعل TBT ، وتغير مخطط الصفحة التراكمي CLS .
لو مافهمتش الكلام ده ، مش ضروري قوي. ممكن تفهمه بعدين. لكن الأهم هو اللي جاي.
حالياً إحنا بنستخدم First Input Delay (FID) وهو وقت التأخير بعد توفر أول المعطيات ع الموقع. بنستخدمها لقياس سرعة استجابة صفحات الويب والمواقع الإلكترونية. لكن السنة اللي جايه هنستخدم interaction to next paint (INP) بدلاً منها.
الـ INP هو الوقت المستغرق من أى تفاعل على صفحة الويب حتى الإستجابة لهذا التفاعل. يعني مش مجرد أول المعطيات أو أول تفاعل .. لأ .. كل التفاعلات على الصفحة. وده هيدينا مقياس أكثر دقة لإستجابة صفحة الموقع والموقع الإلكتروني كـ كل.
طبعاً التغيير ده مهم جداً في طريقة القياس عشان يكون مناسب مع التقنيات الحديثة مثل إطار العمل كويك Qwik و إطار العمل أسترو Astro . لأنهم بيظهروا صفحة الويب ، وبعدها بيخلوا عناصر الصفحة قابلة للإستجابة عشان يسرعوا رؤية الزائر للصفحة على حساب القابلية للتفاعل.
التفاعل هو عبارة عن ضغطة الماوس ، أو اللمس على الشاشة ، أو ضغط زرار على لوحة المفاتيح. الـ INP يتم قياسها كل التفاعلات على كل صفحة ويب من صفحات كل موقع إلكتروني. والرقم الخاص بالـ INP هو أكبر وقت للإستجابة على التفاعل على صفحة الويب.
وهذا جدول بـ قيم الـ INP ومعناها.
INP | المعني |
---|---|
أقل من ٢٠٠ مللي ثانية | استجابة صفحة الويب جيدة |
من ٢٠٠ إلى ٥٠٠ مللي ثانية | استجابة صفحة الويب تحتاج إلى تحسين |
أكبر من ٥٠٠ مللي ثانية | استجابة صفحة الويب سيئة |
للحصول على مزيد من المعلومات المفصلة عن وقت الاستجابة للتفاعل على صفحة الويب ، زور موقع الويب للمطورين المملوك لجوجل من هنا .
أتمني أن تكون استفدت من هذا الشرح.
تابعني على مواقع التواصل الإجتماعي لتعرف كل المقالات والشروحات الجديدة التي أنشرها هنا على مدونة معلومة بإختصار .
- قناتي على يوتيوب
- تابعني على تويتر @abanoubha .
- تابعني على لينكد-إن .
- انضم لقناتي على تيليجرام @abanoubchan .
- تابعني على صفحة الفيسبوك @AbanoubHannaDotCom .