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

Kayce Basques

تشمل الميزات الجديدة والتغييرات الرئيسية التي ستطرأ على "أدوات مطوري البرامج" في Chrome 67 ما يلي:

نسخة الفيديو الخاصة بملاحظات الإصدار:

افتح لوحة الشبكة ثم اضغط على Command+F (في نظام التشغيل Mac) أو Control+F (في أنظمة التشغيل Windows وLinux وChromeOS) لفتح لوحة البحث في الشبكة الجديدة. تبحث "أدوات مطوري البرامج" في عناوين ونصوص جميع طلبات الشبكة لطلب البحث الذي تقدّمه.

البحث عن النص "cache-control" من خلال الجزء الجديد من Network Search (بحث الشبكة).

الشكل 1. البحث عن النص cache-control باستخدام الجزء الجديد "بحث الشبكة"

انقر على مطابقة حالة الأحرف مطابقة الحالة لجعل طلب البحث حساسًا لحالة الأحرف. انقر على استخدام التعبير العادي استخدام التعبير العادي لعرض أي نتائج تتطابق مع النمط الذي تقدّمه. لست بحاجة إلى التفاف التعبير العادي بشرطات مائلة للأمام.

طلب بحث تعبير عادي في جزء "البحث في الشبكة".

الشكل 2. طلب بحث تعبير عادي في جزء "البحث في الشبكة".

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

واجهة المستخدم القديمة والجديدة.

الشكل 3. واجهة المستخدم القديمة على اليمين وواجهة المستخدم الجديدة على اليمين

اضغط على Command+Option+F (نظام التشغيل Mac) أو Control+Shift+F (أنظمة التشغيل Windows وLinux وChromeOS) لفتح البحث العام. يمكنك أيضًا فتحه من خلال قائمة الأوامر.

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

عند ضبط قيمة سمة لون CSS، مثل background-color أو color، على متغيّر CSS، تعرض "أدوات مطوّري البرامج" الآن معاينة لذلك اللون.

مثال على قيم ألوان متغير CSS

الشكل 4. في واجهة المستخدم القديمة على اليمين، لا تتوفّر معاينة ألوان بجانب "color: var(--main-color)"، بينما في واجهة المستخدم الجديدة على اليمين

نسخ النص كاسترجاع

انقر بزر الماوس الأيمن على طلب شبكة ثم اختَر نسخ > نسخ بتنسيق الجلب لنسخ الرمز fetch() المكافئ لهذا الطلب إلى الحافظة.

نَسخ الرمز المكافِئ لطلب معيَّن (Fetch()).

الشكل 5. جارٍ نسخ الرمز المكافئ لـ fetch() لطلب

تنتج أدوات مطوّري البرامج رمزًا برمجيًا على النحو التالي:

fetch("https://preload.glitch.me/styles.css", {
  "credentials": "omit",
  "headers": {},
  "referrer": "https://preload.glitch.me/after/",
  "referrerPolicy": "no-referrer-when-downgrade",
  "body": null,
  "method": "GET",
  "mode": "cors"
});

تعديلات لوحة عمليات التدقيق

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

تتضمّن لوحة عمليات التدقيق عمليتي تدقيق جديدتين، بما في ذلك:

خيارات الضبط الجديدة

يمكنك الآن ضبط لوحة عمليات التدقيق من أجل:

  • الاحتفاظ بإعدادات وكيل المستخدم وإطار عرض جهاز سطح المكتب. وبعبارة أخرى، يمكنك منع لوحة عمليات التدقيق من محاكاة جهاز جوّال.
  • إيقاف تقييد الشبكة ووحدة المعالجة المركزية (CPU)
  • احتفِظ بمساحة التخزين، مثل LocalStorage وIndexedDB، في جميع عمليات التدقيق.

خيارات ضبط التدقيق الجديدة.

الشكل 6. خيارات ضبط التدقيق الجديدة

عرض آثار الأنشطة

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

زر View Trace

الشكل 7. زر عرض بيانات التتبُّع

إيقاف التكرارات اللانهائية

إذا كنت تستخدم تكرارات for أو do...while أو يتكرر كثيرًا، من المحتمل أنك نفذت حلقة لانهائية عن طريق الخطأ أثناء تطوير موقعك الإلكتروني. لإيقاف التكرار اللانهائي، يمكنك الآن:

  1. افتح لوحة المصادر.
  2. انقر على رمز إيقاف مؤقت إيقاف مؤقت. يتغير الزر إلى استئناف تنفيذ النص البرمجي استئناف.
  3. اضغط مع الاستمرار على استئناف تنفيذ النص البرمجي استئناف ثم اختَر إيقاف طلب JavaScript الحالي إيقاف.

في الفيديو أعلاه، يتم تعديل الساعة من خلال موقّت لمدة setInterval(). يؤدي النقر على بدء تكرار لا نهائي إلى تشغيل حلقة do...while لا تتوقف أبدًا. يُستأنف الفاصل الزمني لأنّه لم يكن يعمل عند اختيار إيقاف استدعاء JavaScript الحالي إيقاف.

"وقت المستخدم" في علامات التبويب "الأداء"

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

عرض مقاييس "وقت المستخدم" في علامة التبويب "من أسفل إلى أعلى"

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

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

اختيار مثيلات الجهاز الافتراضي للغة JavaScript في لوحة الذاكرة

تعرض لوحة الذاكرة الآن بوضوح جميع مثيلات الأجهزة الافتراضية في JavaScript المرتبطة بصفحة، بدلاً من إخفائها خلف القائمة المنسدلة Target كما في السابق.

لقطات شاشة قبل وبعد عرض لوحة "الذاكرة"

الشكل 9. في واجهة المستخدم القديمة على اليمين، يتم إخفاء مثيلات الجهاز الافتراضي للغة JavaScript خلف القائمة المنسدلة الاستهداف، بينما تظهر في واجهة المستخدم الجديدة على اليسار في الجدول اختيار مثيل جهاز افتراضي للغة JavaScript.

بجانب المثيل developers.google.com، تتوفّر قيمتان: 8.7 MB و13.3 MB. تمثل القيمة اليسرى الذاكرة المخصّصة بسبب JavaScript. وتمثل القيمة الصحيحة جميع ذاكرة نظام التشغيل التي يتم تخصيصها بسبب مثيل الجهاز الافتراضي (VM). وتشمل القيمة اليمنى القيمة اليسرى. في "إدارة المهام" في Chrome، تتوافق القيمة اليسرى مع JavaScript Memory والقيمة الصحيحة تتوافق مع Memory Footprint.

تمت إعادة تسمية علامة تبويب "الشبكة" إلى علامة تبويب "الصفحة".

في لوحة المصادر، تم تغيير اسم علامة التبويب الشبكة إلى علامة التبويب الصفحة.

نافذتا أدوات مطوري البرامج جنبًا إلى جنب تعرضان التغيير في الاسم.

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

تعديلات المظهر الداكن

يتوفر Chrome 67 مع عدد من التغييرات الطفيفة على نظام ألوان المظهر الداكن. على سبيل المثال، أصبحت أيقونات نقطة الفاصلة وسطر التنفيذ الحالي باللون الأخضر الآن.

لقطة شاشة لرمز نقطة الإيقاف الجديد والسطر الحالي لنظام ألوان التنفيذ.

الشكل 11. لقطة شاشة لرمز نقطة الإيقاف الجديد والخط الحالي لنظام ألوان التنفيذ

شهادة الشفافية في لوحة الأمان

تعرض لوحة الأمان الآن معلومات شفافية الشهادة.

معلومات شفافية الشهادة في لوحة الأمان.

الشكل 12. معلومات حول شفافية شهادة الاعتماد في لوحة الأمان

"عزل الموقع" في لوحة الأداء

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

يشير إلى مخططات الشهب لكل عملية في تسجيل الأداء.

الشكل 13. مخططات اللهب لكل عملية في تسجيل الأداء

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

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

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

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

  • يمكنك إرسال اقتراح أو ملاحظات إلينا عبر crbug.com.
  • يمكنك الإبلاغ عن مشكلة في "أدوات مطوري البرامج" باستخدام خيارات إضافية   المزيد > مساعدة > الإبلاغ عن مشاكل في "أدوات مطوري البرامج" في "أدوات مطوري البرامج".
  • يمكنك نشر تغريدة على @ChromeDevTools.
  • شارِك في التعليقات على الميزات الجديدة في فيديوهات YouTube أو نصائح حول أدوات مطوّري البرامج فيديوهات على YouTube.

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

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

الإصدار 127 من Chrome

الإصدار 126 من Chrome

الإصدار 125 من Chrome

الإصدار 124 من Chrome

الإصدار 123 من Chrome

الإصدار 122 من Chrome

الإصدار 121 من Chrome

الإصدار 120 من Chrome

الإصدار 119 من Chrome

الإصدار 118 من Chrome

الإصدار 117 من Chrome

الإصدار 116 من Chrome

الإصدار 115 من Chrome

الإصدار 114 من Chrome

الإصدار 113 من Chrome

الإصدار 112 من Chrome

الإصدار 111 من Chrome

الإصدار 110 من Chrome

الإصدار 109 من Chrome

الإصدار 108 من Chrome

الإصدار 107 من Chrome

الإصدار 106 من Chrome

الإصدار 105 من Chrome

الإصدار 104 من Chrome

الإصدار 103 من Chrome

الإصدار 102 من Chrome

الإصدار 101 من Chrome

الإصدار 100 من Chrome

الإصدار 99 من Chrome

الإصدار 98 من Chrome

الإصدار 97 من Chrome

الإصدار 96 من Chrome

الإصدار 95 من Chrome

الإصدار 94 من Chrome

الإصدار 93 من Chrome

الإصدار 92 من Chrome

الإصدار 91 من Chrome

الإصدار 90 من Chrome

الإصدار 89 من Chrome

الإصدار 88 من Chrome

الإصدار 87 من Chrome

الإصدار 86 من Chrome

الإصدار 85 من Chrome

الإصدار 84 من Chrome

الإصدار 83 من Chrome

الإصدار 82 من Chrome

تم إلغاء الإصدار 82 من Chrome.

الإصدار 81 من Chrome

الإصدار 80 من Chrome

الإصدار 79 من Chrome

الإصدار 78 من Chrome

الإصدار 77 من Chrome

الإصدار 76 من Chrome

الإصدار 75 من Chrome

الإصدار 74 من Chrome

الإصدار 73 من Chrome

الإصدار 72 من Chrome

الإصدار 71 من Chrome

Chrome 70

الإصدار 68 من Chrome

الإصدار 67 من Chrome

Chrome 66

الإصدار 65 من Chrome

الإصدار 64 من Chrome

الإصدار 63 من Chrome

الإصدار 62 من Chrome

الإصدار 61 من Chrome

الإصدار 60 من Chrome

الإصدار 59 من Chrome