الميزات الجديدة في "أدوات مطوّري البرامج" في الإصدار 136 من Chrome

Sofia Emelianova
Sofia Emelianova
GitHub

تحسينات على لوحة الأداء

يقدّم هذا الإصدار عددًا من التحسينات على لوحة الأداء.

إحصاءات جديدة عن الأداء

تمّت إضافة إحصاءات جديدة إلى علامة التبويب الأداء > الإحصاءات:

  • بروتوكول HTTP الحديث الذي يُبرز الطلبات التي تستخدم بروتوكول HTTP/1.1 القديم
  • استخدام فترات تخزين مؤقت فعّالة تُبرز الطلبات التي يمكن أن تستفيد من فترات تخزين مؤقت أطول وتسريع وقت تحميل موقعك الإلكتروني
  • عرض الخط الذي يعرض لك الوقت المقدَّر الذي يمكنك توفيره في حال تحسين font-display.

ثلاث إحصاءات جديدة في علامة التبويب "الإحصاءات"

انقر لتمييز

يمكنك الآن النقر على العناصر في جداول الملخّص ومن الأسفل إلى الأعلى وشجرة المكالمات وسجلّ الأحداث لإبقاء الأحداث المقابلة مميّزة في التتبّع وتخفيف مستوى ظهور البقية أثناء تصفّح تتبّع الأداء.

أوقات استجابة الخادم في "ملخّص طلبات الشبكة"

تعرض الآن علامة التبويب الملخّص في لوحة الأداء أوقات استجابة الخادم لطلبات الشبكة التي تنفّذ تقنيات العرض من جهة الخادم.

جدول "مُدد استجابة الخادم" في "ملخّص طلب الشبكة"

تحصل لوحة الأداء على البيانات من عنوان Server-Timing ردّ.

فلترة ملفات تعريف الارتباط في قسم "الخصوصية والأمان"

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

الفلتر في جدول "ملفات تعريف الارتباط التابعة لجهات خارجية"

الأحجام بوحدات كيلوبايت في الجداول على مستوى اللوحات

للحفاظ على ثبات الوحدات في السياق نفسه، تعرض الجداول في لوحتَي الشبكة والذاكرة وجدول الإعلانات الأولى / الثالثة في الأداء > الملخّص الآن جميع الأحجام بالكيلوبايت. يتيح لك ذلك مقارنة الأرقام مباشرةً في العمود نفسه وعلى مستوى اللوحات بدلاً من تتبُّع وحدات MB مقارنةً بوحدات kB مقارنةً بوحدات B.

وحدات الحجم قبل توحيدها وبعدها

تتيح ميزة الإكمال التلقائي استخدام corner-shape وcorner-*-shape في "العناصر" > "الأنماط".

يمكن الآن أن تقترح ميزة الإكمال التلقائي في العناصر > الأنماط القيم المقابلة لسمتَي corner-shape وcorner-*-shape.

خيارات الإكمال التلقائي للسمة corner-shape

مشكلة في Chromium: 402346406

ميزة تجريبية: تمييز المشاكل المتعلّقة بالعناصر والسمات في DOM

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

قبل وبعد تمييز مشكلة في نموذج DOM في شجرة نموذج DOM باستخدام نصائح ورابط إلى لوحة "المشاكل"

تُبرز لوحة العناصر حاليًا العناصر الفرعية غير الصالحة للعنصر <select>، وتعريفات ARIA غير المتطابقة، وسمات ARIA غير الصالحة.

مشكلة في Chromium: ‏ 378738916

Lighthouse 12.5.0

تعمل لوحة Lighthouse الآن بإصدار Lighthouse 12.5.0.

من أبرز التغييرات في هذا الإصدار أنّ legacy-javascript يستخدم الآن Baseline بدلاً من esmodules. يمكنك الاطّلاع على القائمة الكاملة بالتغييرات.

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

مشكلة في Chromium: ‏ 40543651

لحظات مميّزة متنوعة

في ما يلي بعض الإصلاحات والتحسينات المُهمّة في هذا الإصدار:

  • الأداء > الإحصاءات > شجرة التبعيات على الشبكة: تعرض الآن الوقت المستغرَق لجميع طلبات الشبكة في شجرة الشبكة (400708304).
    • شجرة الاعتمادية على الشبكة: تعرض الآن الوقت المستغرَق لجميع طلبات الشبكة في شجرة الشبكة (400708304).
  • الصور المتحركة: تم إصلاح خطأ كان يتسبب في ظهور عناصر غير متصلة في لوحة الذاكرة بسبب الصور المتحركة التي تم التقاطها 400635410.
  • المسجِّل: يستخدم الآن مربّع حوار التأكيد نفسه المُستخدَم عند لصق الرمز عند تشغيل التسجيل لأول مرة.
  • الطبقات: يعرض الآن إجمالي عدد الطبقات وإجمالي الذاكرة لجميع الطبقات المرئية في شريط الحالة في أسفل الصفحة.
  • الذاكرة: تم تحسين عملية إعداد لقطة الذاكرة العشوائية من خلال إجراء المهام بشكل موازٍ بين عاملَي تشغيل بدلاً من استخدام عامل تشغيل واحد (42203857).
  • المشاكل: يتم الآن الإبلاغ عن أخطاء مشاركة الموارد المتعدّدة المصادر (CORS) في "الوصول إلى الشبكة المحلية" (LNA) (395895368).
  • تسهيل الاستخدام:
    • التلميحات: تظهر الآن عند الضغط على مفتاح التشغيل السريع بدلاً من التركيز (396311936).
    • العناصر > الأنماط: يمكن الآن التفاعل مع الدالة var() باستخدام لوحة المفاتيح، ما يعني أنّه يمكنك اختيار --custom-property والضغط على مفتاح Enter للانتقال إلى رابط الاستهداف (401212692).

تنزيل قنوات المعاينة

ننصحك باستخدام إصدار Canary أو Dev أو الإصدار التجريبي من Chrome كمتصفّح التطوير التلقائي. تتيح لك قنوات المعاينة هذه الوصول إلى أحدث ميزات DevTools، وتتيح لك اختبار واجهات برمجة تطبيقات منصات الويب المتطوّرة، وتساعدك في العثور على المشاكل في موقعك الإلكتروني قبل أن يعثر عليها المستخدمون.

التواصل مع فريق "أدوات مطوّري البرامج في Chrome"

استخدِم الخيارات التالية لمناقشة الميزات الجديدة أو التحديثات أو أي شيء آخر مرتبط بـ "أدوات مطوّري البرامج".

الميزات الجديدة في "أدوات المطوّرين"

قائمة بكل ما تم تناوله في سلسلة الميزات الجديدة في أدوات مطوّري البرامج