الميزات الجديدة في "أدوات مطوري البرامج"، الإصدار Chrome 129

Sofia Emelianova
Sofia Emelianova

يتيح Recorder التصدير إلى Puppeteer لمتصفّح Firefox

في إطار توفير إمكانية استخدام WebDriver BiDi، يمكن للوحة المسجّلة الآن تصدير التسجيلات إلى Puppeteer for Firefox. من خلال توافق Puppeteer مع Firefox، يمكنك الآن تسجيل تدفقات المستخدمين باستخدام لوحة Recorder في Chrome DevTools وتصديرها وتشغيلها على كلّ من Firefox وChrome.

قبل وبعد إضافة خيار "Puppeteer for Firefox" إلى قائمة التصدير في "المسجّل"

لمزيد من المعلومات، يمكنك الاطّلاع على WebDriver BiDi: مستقبل التشغيل الآلي على جميع المتصفحات.

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

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

ملاحظات حول مقاييس الأداء المباشرة

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

للاطّلاع على الملاحظات المباشرة بشأن مقياسَي LCP وCLS، افتح لوحة الأداء. للاطّلاع على مقياس INP، عليك إجراء تفاعل على إحدى الصفحات. لمقارنة المقاييس المحلية بتجربة المستخدم المجمَّعة من "تقرير تجربة المستخدم على Chrome"، أضِف بيانات الحقول: في قسم بيانات الحقول على يسار الصفحة، انقر على إعداد، ثم انقر على حسنًا في نافذة الحوار. مرِّر المؤشر فوق قيمة مقياس معيّن للاطّلاع على تلميح يتضمّن المزيد من المعلومات.

ملاحظات مباشرة حول المقاييس في لوحة "الأداء"

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

يعمل مربّع البحث في لوحة الأداء الآن أيضًا على مستوى مسار الشبكة، ما يتيح لك العثور على الطلبات باستخدام الاختصار Ctrl / Cmd + F.

تم العثور على طلب شبكة من خلال البحث.

الاطّلاع على تقارير تتبُّع تسلسل استدعاء الدوال البرمجية لمكالمات performance.mark وperformance.measure

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

تعرض الصورة التالية عمليات تتبُّع تسلسل استدعاء الدوال البرمجية قبل وبعد تنفيذ استدعاءات performance.mark وperformance. measure.

لمزيد من المعلومات، اطّلِع على مقالة تخصيص بيانات الأداء باستخدام واجهة برمجة التطبيقات الخاصة بإمكانية التوسّع.

استخدام بيانات العناوين التجريبية في لوحة "الملء التلقائي"

تقدّم لوحة الملء التلقائي الآن بيانات اختبار لنماذج العناوين. يسهّل ذلك اختبار نماذج العناوين على موقعك الإلكتروني عندما لا تكون لديك أي عناوين محفوظة في Chrome أو عندما تستخدم ملف ضيف.

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

قبل وبعد إضافة خيارات بيانات اختبار الملء التلقائي إلى قائمة منسدلة لحقل نموذج عنوان

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

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

فرض المزيد من الحالات لعناصر معيّنة

يتيح لك القسم :hov في العناصر > الأنماط الآن المزيد من الفئات الزائفة التي يمكنك تفعيلها بشكل إلزامي. تظهر مجموعة الخيارات الجديدة ضمن القائمة المنسدلة لحالة فرض عنصر معيّن وهي خاصة بعناصر معيّنة تحدّدها. على سبيل المثال، يتضمّن <label> و<input> مجموعات مختلفة من الخيارات.

قبل وبعد إضافة إمكانية فرض حالات عناصر معيّنة

مشكلة في Chromium: 40280012.

تُكمل "العناصر" > "الأنماط" الآن تلقائيًا المزيد من خصائص الشبكة

توفّر علامة التبويب العناصر > الأنماط الآن خيارات الإكمال التلقائي عند تعديل أسماء خطوط ومساحات الشبكة.

قبل إضافة خيارات الإكمال التلقائي وبعدها عند تعديل أسماء خطوط الشبكة

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

الإصدار 12.2.0 من Lighthouse

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

يتضمّن هذا التحديث عددًا من إصلاحات الأخطاء. الاطّلاع على قائمة التغييرات الكاملة

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

مشكلة في Chromium: 772558.

لمحات متنوّعة

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

  • العناصر:
    • تم إصلاح خطأ في العرض غير الصحيح لسمات الطول المحمّلة بشكل زائد 357020613.
    • تمت إعادة تسمية position-try-options إلى position-try-fallbacks وفقًا للمواصفات.
    • تؤدي إعادة تحميل الصفحة الآن إلى استعادة العقدة المحدّدة حتى داخل إطار iframe 40719145.
    • تسهيل الاستخدام: ستشير الآن برامج قراءة الشاشة إلى الزر عرض العنصر 357382536.
  • الأداء > الشبكة: يفتح خيار القائمة العرض في "الشبكة" الآن علامة التبويب العناوين لطلب الشبكة ذي الصلة.
  • وحدة التحكّم:
    • لم يعُد يتم فتح وحدة التحكّم تلقائيًا عند حدوث أخطاء في إضافة C/C++‎ 356320158.
    • تم إصلاح الخطأ الذي كان يتسبب في عدم تقييم import.meta في وحدة JavaScript عند إيقافها مؤقتًا 40743793.
  • الذاكرة: تم إصلاح الخطأ الذي كان يؤدي إلى عدم ظهور "استعادة عمليات الاحتفاظ التي تم تجاهلها" بعد تجاهل عملية احتفاظ 327337527.

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

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

التواصل مع فريق Chrome DevTools

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

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

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