الميزات الجديدة في DevTools، الإصدار 134 من Chrome

Sofia Emelianova
Sofia Emelianova
GitHub

لوحة الخصوصية والأمان

تمّت ترقية لوحة الأمان القديمة إلى لوحة الخصوصية والأمان، وتمّ إضافة قسم جديد مخصّص للخصوصية. في هذا القسم، يمكنك إجراء ما يلي:

  • عندما تكون "أدوات مطوّري البرامج" مفتوحة، يمكنك تقييد ملفات تعريف الارتباط التابعة لجهات خارجية مؤقتًا مع استثناءات أو بدونها واختبار سلوك الموقع الإلكتروني.
  • يمكنك الاطّلاع على جدول يحتوي على معلومات عن ملفات تعريف الارتباط التابعة لجهات خارجية، بما في ذلك ما إذا تم حظرها أو استثناؤها من خلال وضع الحدود المؤقتة، ونوع ملفات تعريف الارتباط التي قد تتأثر.

قبل إضافة قسم "الخصوصية" إلى لوحة "الأمان" وبعدها

مشكلة Chromium: 352364594

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

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

الإعدادات المُعدَّلة مسبقًا لتقييد أداء وحدة المعالجة المركزية (CPU)

يمكنك الآن ضبط إعدادات الأداء تلقائيًا والحصول على إعدادَين مُسبَقَين إضافيَين لتقليل أداء وحدة المعالجة المركزية (CPU) يُحاكيان بدقة أكبر أداء الأجهزة الجوّالة المنخفضة المستوى والمتوسطة المستوى.

في القائمة المنسدلة الأداء > تقليل سرعة وحدة المعالجة المركزية، اختَر ضبط الإعدادات...، ثمّ في الإعدادات، انقر على ضبط الإعدادات، متابعة، وانتظِر حتى تحسب أدوات المطوّرين معدّلات التباطؤ لجهازك. يمكنك العثور على خيارات الحدّ من السرعة المعاد ضبطها في القائمة المنسدلة الأداء > الحدّ من سرعة وحدة المعالجة المركزية.

قبل إضافة عملية معايرة الحدّ الأقصى للسرعة وبعدها

اختيار أحداث أداء مختلفة في محادثة الذكاء الاصطناعي نفسها

تتيح لك الآن لوحة مساعدة الذكاء الاصطناعي تغيير الحدث المحدّد في تتبُّع الأداء في المحادثة نفسها. بعبارة أخرى، ليس عليك بدء محادثة جديدة للتحدّث عن حدث مختلف.

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

تمّت إضافة جدول جديد في علامة التبويب الملخّص ضمن لوحة الأداء، ما يتيح لك التمييز بين بيانات الطرف الأول والبيانات التابعة لجهات خارجية وبيانات الإضافات.

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

بالإضافة إلى ذلك، انقر على رمز بجانب إدخال مميّز في الجدول للانتقال إلى علامة التبويب من الأسفل إلى الأعلى المجمّعة حسب الجهات الخارجية.

بيانات الحقول في نصائح أدوات التحديد والإحصاءات

إذا كانت بيانات الحقول مفعَّلة، يمكنك الآن الاطّلاع عليها في نصائح أدوات وضع العلامات على المقاييس وعلامة التبويب الإحصاءات.

قبل وبعد إضافة بيانات الملفات إلى نصائح أدوات التحديد وعلامة التبويب "الإحصاءات"

مشكلة Chromium: 368135130

إحصاءات "إعادة التدفق الإلزامية"

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

عند تمرير مؤشر الماوس فوق الإحصاءات الجديدة، يتم تمييز أكبر طلب استدعاء للدالة من خلال إعادة تدفق قسري ومسار تتبع تسلسل استدعاء الدوالّ، كما يتم عرض إجمالي وقت إعادة التدفق.

قبل إضافة إحصاءات "إعادة التدفق القسري" وبعدها

مشكلة Chromium: 369766156

إحصاءات "تحسين حجم عناصر DOM"

وتشمل الإحصاءات الجديدة الأخرى تحسين حجم عناصر DOM. يمكن أن يؤدي توفّر شجرة نموذج عناصر في المستند (DOM) كبيرة إلى إبطاء أداء صفحتك.

تُبرز الإحصاءات عمليات إعادة تدفق التنسيقات وإعادة احتساب الأنماط الطويلة التي تأثّرت بحجم كبير لنموذج DOM في تتبع الأداء، كما تقدّم إحصاءات عن إجمالي العناصر والعمق ومعظم العناصر الفرعية.

قبل إضافة إحصاءات "تحسين حجم عناصر DOM" وبعدها

تمديد سجلّ تتبُّع الأداء باستخدام console.timeStamp

تتيح واجهة برمجة التطبيقات Extensibility API الآن استخدامconsole.timeStamp. بالإضافة إلى performance.measure وperformance.mark، يمكنك الآن إنشاء مسارات مخصّصة في تتبُّع الأداء وتسجيل علامات مخصّصة باستخدام console.timeStamp، كبديل أخفّ لا يضيف إدخالات إلى المخطط الزمني للأداء الداخلي للمتصفّح، بل يعرضها فقط في تتبُّع الأداء.

على سبيل المثال، يمكنك استخدام البنية التالية:

console.timeStamp("Start");
// Some time later ...
console.timeStamp("End");
// Some time later ...
console.timeStamp("Measure 1", "Start", "End", "Track 1");
// Some time later ...
console.timeStamp("Measure 2", "Start", undefined, "Track 1");

من خلال إعدادات الالتقاط > عرض قنوات الإصدار المخصّصة، ستظهر لك قناة الإصدار المخصّصة في التتبّع:

قبل إضافة ميزة console.timeStamp وبعدها

تحسينات على لوحة "العناصر"

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

القيم في الوقت الفعلي للأنماط المتحرّكة

تعمل علامة التبويب العناصر > الأنماط الآن على تعديل قيم الأنماط المتحركة في الوقت الفعلي.

إتاحة الفئة الزائفة :open والعناصر الزائفة المختلفة

تتيح لوحة العناصر الآن استخدام الفئة الزائفة :open في قسم الأنماط > :hov > فرض حالة عنصر معيّن لعناصر HTML معيّنة، مثل <details> و<select> و<dialog> و<input>.

قبل إضافة الخيار ‎:open وبعدها

بالإضافة إلى ذلك، تتيح لوحة العناصر الآن أيضًا استخدام عدة عناصر زائفة جديدة: ::checkmark و::picker-icon والعناصر ذات الصلة بالمنصة الدوّارة ::column و::scroll-button و::scroll-marker و::scroll-marker-group.

مشاكل Chromium: 383157184، 379805728

نسخ جميع رسائل وحدة التحكّم

يمكنك الآن النقر بزر الماوس الأيمن ونسخ جميع رسائل وحدة التحكّم في آنٍ واحد.

قبل إضافة خيار &quot;نسخ وحدة التحكّم&quot; وبعدها

بالإضافة إلى ذلك، يمكنك العثور على خيار نسخ مشابه في قائمة السياق الشبكة > حمولة الطلب.

مشاكل Chromium: 40206460 و384967020

وحدات البايت في لوحة "الذاكرة"

تعرض لوحة الذاكرة الآن الأحجام بوحدات البايت المناسبة بدلاً من أعداد كبيرة من البايت.

قبل عرض وحدات البايت وبعده

مشكلة Chromium: ‏ 388589515

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

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

  • الأداء:
    • التعليقات التوضيحية: يمكنك الآن النقر على التصنيف لاختيار الإدخال المقابل (crbug.com/388224764).
    • الإحصاءات: يؤدي النقر على متغيّر التصميم التراكمية (CLS) في علامة التبويب الإحصاءات إلى اختيار أسوأ مجموعة بدلاً من أسوأ تغيير.
  • قائمة التجاهل: يتم الآن تجاهل العناصر الداخلية للعقد التي تبدأ بالرقم node: تلقائيًا (crbug.com/382453615).
  • التعبيرات المباشرة: تم إصلاح الخلل الذي كان يتسبب في تأثير التعبير المباشر في الأمر $_ (crbug.com/388437265).
  • العناصر > الأنماط: تتضمّن الآن الأطوال النسبية نافذة منبثقة تعرض القيمة المطلقة (crbug.com/40778486).
  • تسهيل الاستخدام: تُعلِن الآن رؤوس الأعمدة عمّا إذا كان بالإمكان ترتيبها.
  • تظهر رموز علامات التبويب الآن على الجانب الأيمن بجانب أسماء علامات التبويب بدلاً من الجانب الأيسر.

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

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

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

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

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

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