الميزات الجديدة في أدوات مطوّري البرامج (Chrome 98)

Jecelyn Yeen

ميزة المعاينة: العرض الكامل لشجرة تسهيل الاستخدام

تسهِّل عليك شجرة تسهيل الاستخدام للصفحة بأكملها الجديدة الحصول على نظرة عامة حول شجرة تسهيل الاستخدام للصفحة بأكملها وتساعدك في فهم كيفية عرض محتوى الويب للتكنولوجيا المساعِدة بشكل أفضل.

في لوحة العناصر، افتح لوحة تسهيل الاستخدام واختَر مربّع الاختيار تفعيل شجرة تسهيل الاستخدام بملء الصفحة. بعد ذلك، أعِد تحميل "أدوات المطوّر" وسيظهر لك زرّ جديد لإمكانية الوصول في لوحة العناصر.

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

اختَر عقدة ثم ارجع إلى طريقة عرض شجرة نموذج DOM. يتم الآن اختيار عقدة DOM المقابلة. هذه طريقة رائعة لفهم عملية الربط بين عقدة نموذج كائن المستند (DOM) وعقدة شجرة تسهيل الاستخدام. يعمل هذا الإجراء أيضًا مع شجرة نموذج العناصر في المستند ⬌ العرض التدرّجي لتسهيل الاستخدام.

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

ما زال فريقنا يعمل بنشاط على ميزة المعاينة هذه. ونتطلّع إلى تلقّي ملاحظاتك لتحسينات إضافية.

العرض الكامل لشجرة تسهيل الاستخدام على الصفحة

مشكلة Chromium: 887173

تغييرات أكثر دقة في علامة التبويب "التغييرات"

تتم تلقائيًا طباعة التغييرات التي تطرأ على الرمز في علامة التبويب التغييرات.

في السابق، كان من الصعب تتبُّع التغييرات الفعلية للرمز المصدر المصغَّر بسبب عرض جميع هذه الرموز في سطر واحد.

علامة التبويب "التغييرات"

مشاكل Chromium: 1238818 و1268754 و1086491

ضبط مهلة أطول لتسجيل مسار المستخدِم

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

على سبيل المثال، سجّلت مسار مستخدم في هذه الصفحة التجريبية لتحميل عنصر القائمة والنقر عليه. ومع ذلك، يكون تحميل عناصر القائمة بطيئًا (يستغرق 6 ثوانٍ). تعذّرت إعادة التشغيل لتدفق المستخدم هذا لأنه يتجاوز 5 ثوانٍ (المهلة التلقائية).

يمكننا استخدام إعدادات المهلة الجديدة لحلّ هذه المشكلة. وسِّع الخطوة التي نقر فيها على عنصر القائمة. عدِّل الخطوة من خلال إضافة مهلة واضبطها على 6000 مللي ثانية (أي 6 ثوانٍ).

ويمكنك اختياريًا ضبط المهلة في إعدادات إعادة التشغيل لكل الخطوات. وسِّع إعدادات إعادة التشغيل وعدِّل قيمة المهلة.

إعدادات مهلة تسجيل مسار المستخدِم

مشكلة Chromium: 1257499

التأكّد من إمكانية تخزين صفحاتك مؤقتًا باستخدام علامة التبويب "التخزين المؤقت للصفحات"

التخزين المؤقت للصفحات (أو bfcache) هو أداة تحسين للمتصفّح تتيح الانتقال الفوري للأمام أو للخلف.

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

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

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

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

مشكلة Chromium: 1110752

فلتر جديد في لوحة "الخصائص"

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

لا يتم تلقائيًا عرض المواقع التي تكون قيمتها null أو undefined. فعِّل مربّع الاختيار عرض الكل لعرض جميع المواقع.

تتيح لك هذه التحسينات الوصول إلى المواقع التي تهمّك بشكل أسرع، وبالتالي تحسين إنتاجيتك.

فلتر لوحة "الخصائص"

مشكلة Chromium: 1269674

محاكاة ميزة وسائط فرض الألوان في CSS

تُستخدَم ميزة الوسائط الألوان المفروضة في CSS لرصد ما إذا كان وكيل المستخدم قد فعّل وضع الألوان المفروضة (مثل وضع "التباين العالي" في Windows) الذي يفرض لوحة ألوان محدودة يختارها المستخدم على الصفحة.

افتح قائمة الأوامر، وشغِّل الأمر عرض المعالجة، ثم اضبط القائمة المنسدلة محاكاة ميزة "الألوان المفروضة" لوسائط صفحات الأنماط المتتالية (CSS).

ميزة الوسائط "الألوان المفروضة" في CSS

مشكلة Chromium: 1130859

عرض أدوات القياس عند التمرير

يمكنك الآن فتح قائمة الأوامر وتنفيذ الأمر عرض الأُطر عند التمرير. تعمل أدوات قياس الصفحات على تسهيل قياس عرض العنصر وارتفاعه.

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

عرض أدوات القياس عند التمرير

مشكلة Chromium: 1270562

إتاحة row-reverse وcolumn-reverse في محرِّر Flexbox

أضاف محرِّر Flexbox زرَّين جديدَين للتوافق مع row-reverse وcolumn-reverse في flex-direction.

محرِّر Flexbox

مشكلة Chromium: 1263866

اختصارات جديدة للوحة المفاتيح لإعادة تشغيل XHR وتوسيع كل نتائج البحث

اختصارات لوحة المفاتيح لإعادة تشغيل XHR في لوحة الشبكة

اختَر طلب XHR في لوحة الشبكة واضغط على R في لوحة المفاتيح لإعادة تشغيل طلب XHR. في السابق، كان بإمكانك إعادة تشغيل XHR فقط من خلال قائمة السياقات (النقر بزر الماوس الأيمن > إعادة تشغيل XHR).

إعادة تشغيل XHR

مشكلة Chromium: 1050021

اختصار لوحة المفاتيح لتوسيع جميع نتائج البحث

تمت إضافة اختصار جديد في علامة التبويب البحث، ما يتيح لك توسيع جميع نتائج البحث وتصغيرها. في السابق، كان بإمكانك توسيع نتائج البحث وتصغيرها فقط من خلال النقر على ملف واحد في كل مرة.

افتح علامة التبويب "بحث" من خلال الضغط على Esc > قائمة النقاط الثلاث > بحث. أدخِل سلسلة بحث (مثل دالة) واضغط على Enter للاطّلاع على قائمة نتائج البحث. ركِّز على نتائج البحث واستخدِم الاختصار التالي لتوسيع/تصغير ملفات البحث:

  • Windows / Linux: Ctrl + Shift + { أو }
  • MacOS: Cmd + Options + { أو }

انتقِل إلى اختصارات لوحة المفاتيح للاطّلاع على اختصارات لوحة المفاتيح في "أدوات مطوّري البرامج في Chrome".

مشكلة Chromium: 1255073

Lighthouse 9 في لوحة Lighthouse

تعمل لوحة Lighthouse الآن على إصدار Lighthouse 9. ستعرض أداة Lighthouse الآن جميع العناصر التي تتشارك المعرّف نفسه.

معرّف العنصر غير الفريد من مشكلات إمكانية الوصول الشائعة. على سبيل المثال، يتم استخدام المعرّف المُشار إليه في سمة aria-labelledby في عناصر متعدّدة.

اطّلِع على الميزات الجديدة في Lighthouse 9.0 لمعرفة المزيد من التفاصيل حول التحديثات.

تحقّق Lighthouse من أنّ "يجب أن يكون لكل العناصر التي يمكن التركيز عليها معرّف فريد"، وتُظهر النتيجة عنصرَين يتضمّنان المعرّف نفسه.

مشكلة Chromium: 772558

لوحة المصادر المحسّنة

تم إجراء العديد من التحسينات على ثبات لوحة المصادر بعد ترقيتها لاستخدام CodeMirror 6. في ما يلي بعض التحسينات البارزة:

  • سرعة أكبر بكثير عند فتح الملفات الكبيرة (مثل WASM وJavaScript)
  • لن يعود عليك التمرير بشكل عشوائي عند الانتقال خلال الرمز البرمجي.
  • اقتراحات محسّنة للإكمال التلقائي للمصادر القابلة للتعديل (مثل المقتطفات أو التبديل المحلي)

مشكلة Chromium: 1241848

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

في ما يلي بعض الإصلاحات البارزة في هذا الإصدار:

  • عرض مخطّط العرض الإعلاني بدون انقطاع لطلبات الشبكة بشكل صحيح كان التصميم سابقًا غير صالح. (1275501)
  • لم تعُد ميزة تمييز الرموز البرمجية تعمل عند البحث في المستندات التي تحتوي على أسطر طويلة جدًا في لوحة المصادر. تم حلّ المشكلة الآن. (1275496)
  • لم تعُد علامة التبويب حمولة مكرّرة في طلبات الشبكة. (1273972)
  • تم إصلاح تفاصيل متغيّرات التصميم غير المتوفّرة في قسم الملخّص في لوحة الأداء. (1259606)
  • استخدام الأحرف العشوائية (مثل , و.) في طلبات البحث في الشبكة (1267196)

[ميزة تجريبية] نقاط النهاية في لوحة Reporting API

تم تقديم اللوحة التجريبية Reporting API في Chrome 96 لمساعدتك في تتبُّع التقارير التي يتم إنشاؤها على صفحتك وحالتها.

أصبح قسم نقاط النهاية متاحًا الآن. وتقدّم لك هذه الصفحة نظرة عامة على جميع نقاط النهاية التي تم ضبطها في عنوان Reporting-Endpoints.

تعرَّف على كيفية استخدام Reporting API لرصد انتهاكات الأمان وطلبات البيانات من واجهة برمجة التطبيقات المتوقّفة والمزيد.

لوحة Reporting API

مشكلة Chromium: 1200732

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

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

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

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

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

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