الميزات الجديدة في Lighthouse 10

Brendan Kenny
Brendan Kenny

Lighthouse هي أداة تدقيق للمواقع الإلكترونية، تساعد المطوّرين في توفير فرص وبيانات التشخيص لتحسين تجربة المستخدم على مواقعهم الإلكترونية.

تتوفّر أداة Lighthouse 10 على الفور في سطر الأوامر حتى npm وفي Chrome Canary. وستظهر في إصدار Chrome الثابت في الإصدار 112 وفي إحصاءات PageSpeed خلال الأسابيع المقبلة.

التغييرات في النتائج

في أداة Lighthouse 10، تمت إزالة مقياس الوقت المستغرق في التفاعل (TTI)، لانتهاء عملية الإيقاف النهائي التي بدأت في Lighthouse 8. سيتم تغيير نتيجة تقييم TTI البالغة 10% إلى متغيّرات التصميم التراكمية (CLS)، والتي ستشكل الآن% 25 من نتيجة الأداء الإجمالية.

يشير هذا المصطلح إلى نقطة زمنية معيّنة، إلا أنّ طريقة تحديدها تجعلها حسّاسة للغاية لطلبات الشبكة والمهام الطويلة. إنّ سرعة عرض أكبر محتوى مرئي (LCP) ومؤشر السرعة عادةً ما يكونان إشارات استدلالية أفضل بشأن تحميل محتوى الصفحة مقارنةً بعدد الطلبات النشطة على الشبكة. أمّا إجمالي وقت الحظر (TBT)، فيتعامل مع المهام التي تستغرق وقتًا طويلاً ومدى توفُّر سلسلة التعليمات الرئيسية بشكل أكثر فعالية، ويرتبط بشكل أفضل مع مؤشرات أداء الويب الأساسية وفقًا لقياسها في المجال.

إنّ زيادة حجم متغيّرات التصميم التراكمية (CLS) هي عرضية لإزالة مؤشر TTI، لكنّه يعكس بشكل أفضل أهميته كـ "أحد مؤشرات أداء الويب الأساسية" وسيزيد من التركيز بشكل مثالي على المواقع الإلكترونية التي لا تزال تُجري تغييرات غير ضرورية في التصميم.

ونتوقّع أن يؤدي ذلك إلى تحسين نتائج أداء معظم الصفحات، لأنّ معظم الصفحات عادةً ما تحقّق أداءً أفضل في متغيّرات التصميم التراكمية (CLS) مقارنةً بأداة TTI. في تحليل شمل 13 مليون صفحة تم تحميلها في آخر إصدار من أرشيف HTTP، شهد% 90 من هذه الصفحات تحسُّنًا في نتيجة الأداء في Lighthouse، وشهد% 50 منها تحسّنًا في الأداء بمعدّل أكثر من 5 نقاط.

مقياس لمقياس Lighthouse، مقسَّمًا حسب المقاييس (FCP وSI وLCP وTBT وCLS) التي تشكّل النتيجة الإجمالية

إذا كنت لا تزال بحاجة إلى قيمة TTI في Lighthouse (على سبيل المثال، في تأكيد CI)، ستظل متاحة بدون تغيير على نتيجة Lighthouse JSON، فقط مع استخدام القيمة 0 للنتيجة ومخفية في تقرير HTML. من المفترض أن يستمر عمل أي إذن وصول مبرمج لقيمة JSON بدون تغييرات.

عمليات تدقيق جديدة

تُجري أداة Lighthouse 10 تدقيقًا جديدًا للأداء وإجراء تغييرات كبيرة على أداء آخر.

ميزة "التخزين المؤقت للصفحات"

تُعد التخزين المؤقت للصفحات (bfcache) إحدى الأدوات الأكثر فعالية المتاحة لتحسين أداء الصفحة للمستخدمين الفعليين. بخلاف ذاكرة التخزين المؤقت العادية للمتصفح، سيستعيد الصفحة التي يتم تحميلها من التخزين المؤقت للصفحات تنسيق الصفحة وحالة التنفيذ على الفور تقريبًا، ما يؤدي إلى تخطي جميع أنشطة تحميل الصفحة وعرض صفحتك للمستخدمين فورًا أثناء تنقّلهم للخلف وللأمام عبر سجلّهم.

ومع ذلك، هناك بعض الطرق التي يمكن أن تمنع بها الصفحة المتصفِّح من استعادة تلك الصفحة من ذاكرة التخزين المؤقت لميزة "التخزين المؤقت للصفحات". يؤدي تدقيق Lighthouse الجديد هذا إلى الانتقال من صفحة الاختبار إلى صفحة أخرى لمعرفة ما إذا كان قابلاً للتخزين المؤقت أم لا، كما يسرد أسباب تعذُّر ذلك.

مثال على نتيجة من تدقيق bfcache وإدراج تعذُّر العثور على نتائج بسبب اتصال IndexDB مفتوح وإلغاء تحميل المعالجات في الصفحة

يمكنك إلقاء نظرة على مستندات تدقيق Bfcache للحصول على مزيد من المعلومات.

منع لصق الإدخالات

تم توسيع قسم تدقيق أفضل الممارسات القديم "السماح للمستخدمين باللصق في حقول كلمة المرور" للتأكّد من نجاح اللصق في أي حقل إدخال (غير للقراءة فقط). بالنسبة إلى معظم المواقع الإلكترونية، يؤدي منع اللصق إلى ترك انطباع سلبي تمامًا لدى المستخدم، كما يمنع سير العمل المشروع للأمان وإمكانية الوصول.

أصبحت عملية التدقيق الجديدة الآن "السماح للمستخدمين باللصق في حقول الإدخال" (paste-preventing-inputs).

مستخدمو العُقدة

إذا كنت تستخدم Lighthouse كمكتبة للعُقد، هناك بعض التغييرات التي قد تؤدي إلى تعطُّل آليًا في هذا الإصدار، وقد تحتاج إلى أخذها في الاعتبار. اطّلِع على سجلّ التغييرات 10.0 للحصول على التفاصيل الكاملة.

تأتي أداة Lighthouse 10 مع بيانات كاملة من النوع TypeScript. من المفترض أن تتم الآن كتابة أي بيانات تم استيرادها من lighthouse، وهو أمر من المفترض أن يكون مفيدًا بشكلٍ خاص إذا كنت تعمل على برمجة تدفقات مستخدمي Lighthouse.

نص برمجي للعقدة يستورد Lighthouse كدالة، ويوضح أن كائن الخيارات الذي تم تمريره إلى الدالة يمكن الآن التحقّق منه باستخدام TypeScript

ننصحك بتجربة الأنواع وإعلامنا إذا واجهت أي مشاكل في استخدامها.

منارة للركض

تتوفّر أداة Lighthouse في أدوات مطوري البرامج في Chrome وnpm (كوحدة عقدة وأداة واجهة سطر الأوامر) وكإضافة متصفّح (في Chrome وFirefox). كما أنه يفعّل العديد من خدمات Google، بما في ذلك إحصاءات PageSpeed.

لتجربة واجهة سطر الأوامر لعقدة Lighthouse، استخدِم الأوامر التالية:

npm install -g lighthouse
lighthouse https://www.example.com --view

التواصل مع فريق Lighthouse

لمناقشة الميزات الجديدة أو التغييرات التي تم إجراؤها على الإصدار 10 من Lighthouse أو أي شيء آخر متعلق بأداة Lighthouse: