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

Kayce Basques

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

إصدار الفيديو لملاحظات الإصدار:

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

البحث عن النص '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. خيارات ضبط التدقيق الجديدة

عرض الآثار

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

زر "عرض سجلّ التتبُّع"

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

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

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

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

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

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

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

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

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

بشكل عام، يمكنك الآن اختيار أيّ من الأقسام (Main Thread وUser Timing وGPU وScriptStreamer وما إلى ذلك) والاطّلاع على نشاط هذا القسم في علامات التبويب.

اختيار آلات JavaScript الافتراضية في لوحة الذاكرة

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

لقطات الشاشة قبل وبعد استخدام لوحة الذاكرة

الشكل 9. في واجهة المستخدم القديمة على اليمين، تكون مثيلات JavaScript VM مخفية خلف القائمة المنسدلة Target (الهدف)، بينما تظهر في واجهة المستخدم الجديدة على اليمين في جدول Select JavaScript VM Instance (اختيار مثيل JavaScript للجهاز الافتراضي).

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

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

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

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

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

إشعارات المظهر الداكن

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

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

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

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

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

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

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

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

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

رسومات بيانية لهب متحرّكة لكل عملية في تسجيل أداء

الشكل 13. رسومات بيانية لكل عملية تتضمن تسجيلاً لأداء الأغنية

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

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

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

يُرجى استخدام الخيارات التالية لمناقشة الميزات والتغييرات الجديدة في المشاركة أو أي موضوع آخر ذي صلة بـ "أدوات مطوري البرامج".

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

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

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

الإصدار 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

Chrome 100

إصدار Chrome 99

Chrome 98

97 من Chrome

الإصدار 96 من Chrome

Chrome 95

Chrome 94

Chrome 93

الإصدار 92 من Chrome

الإصدار 91 من Chrome

90 Chrome

إصدار Chrome 89

إصدار Chrome 88

الإصدار 87 من Chrome

إصدار 86 من Chrome

الإصدار 85 من Chrome

إصدار 84 من Chrome

إصدار Chrome 83

إصدار 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

إصدار Chrome 68

الإصدار 67 من Chrome

Chrome 66

الإصدار 65 من Chrome

إصدار 64 من Chrome

إصدار 63 من Chrome

إصدار 62 من Chrome

إصدار 61 من Chrome

إصدار 60 من Chrome

الإصدار 59 من Chrome