ملخص تشرين الثاني (نوفمبر) في "أدوات مطوري البرامج في Chrome"

Deanna Rubin

تتغيّر أدوات مطوّري البرامج في Chrome بسرعة، لذا أردنا أن نلفت انتباهك إلى بعض الوظائف والتحسينات الجديدة التي أدخلناها على بعض المكوّنات. على وجه التحديد، سنتحدث عن بعض التغييرات في واجهة المستخدم وتحليل JavaScript عالي الدقة وميزات Workspaces الجديدة.

  • دقة عالية في الملفات التعريفية العالية الدقة تصل الآن إلى 0 .1 ملي ثانية
  • تم نقل أشرطة الأدوات إلى أعلى Devtools وتم نقل عمليات الاستبدال إلى أدراج وحدة التحكّم.
  • تمت إضافة عدة ميزات إلى مساحات العمل تتيح إضافة الملفات أو إزالتها أو البحث عنها.

إعداد الملف الشخصي بدقة عالية

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

حتى وقت قريب، كان كلّ من الرسم البياني "العمليات المكثّفة" (من الأسفل إلى الأعلى) والرسم البياني "الشجرة" (من الأعلى إلى الأسفل) التقليديَين، بالإضافة إلى الرسم البياني "لهب الأداء"، لا يعرضان سوى العمليات بدقة تصل إلى ملي ثانية واحدة. وهذا مناسب لمعظم التطبيقات. ومع ذلك، إذا كنت تعمل على تطبيق تُعدّ فيه السرعة مهمة جدًا في واجهة المستخدم، مثل لعبة، قد يكون دقة معالجة ملف بمعدل ملي ثانية واحدًا كبيرًا جدًا للحصول على نتائج مفيدة عن السبب الذي يؤدي إلى بطء موقعك الإلكتروني أو تأخُّر واجهة المستخدم. لتفعيل ميزة "الملف الشخصي بدقة عالية" (متوفّرة حاليًا في الإصدار Canary فقط):

  1. افتح إعدادات "أدوات مطوّري البرامج".
  2. في علامة التبويب عام، ضمن أداة تحليل الأداء، فعِّل تحليل أداء وحدة المعالجة المركزية بدقة عالية.

في ما يلي مثال على رسم بياني للّهب يظهر في عملية التحليل العادية وبدرجة دقة عالية، حيث نحلّل عملية تحميل الصفحة الرئيسية لموقع HTML5Rocks.com:

رسم بياني مفصّل لأداء الرموز بدرجة دقة عادية
رسم بياني مفصّل لأداء الرموز بدقة عالية

عند استخدام الدقة العادية لتحليل الأداء، يتم تقريب وقت العملية دائمًا إلى المللي ثانية التالي، لذا فإنّ العملية التي تستغرق 0.1 ملي ثانية أو أقل لا تزال تُسجَّل على أنّها تستغرق 1 ملي ثانية، وقد لا يتم عرض العمليات الأخرى على الإطلاق في تسلسل استدعاء الدوال البرمجية.

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

تحسينات على واجهة مستخدم "أدوات المطوّرين"

على الرغم من أنّه يتم دائمًا طرح ميزات جديدة في الإصدار Canary، نريد لفت انتباهك إلى بعض التغييرات الرئيسية في واجهة المستخدم: أزرار تصعد إلى أعلى واجهة المستخدم بشكل عام، وأزرار التنقّل في المخطط الزمني ولوحات المعلومات، وإعادة وضع ميزة الاستبدال في "درج وحدة التحكّم".

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

المخطط الزمني القديم

في ما يلي شكل "المخطط الزمني" الآن.

مخطط زمني جديد

يُرجى مراعاة ما يلي:

  1. تظهر الآن جميع أشرطة الأدوات والأزرار في أعلى الشاشة، سواءً كانت أدوات Timeline المحدّدة على ناحية اليسار أو أدوات DevTools العامة على ناحية اليسار.
  2. تتضمّن سجلّات "المخطّط الزمني" الآن بنية التداخل في اللوحة على اليمين، ويمكنك أيضًا استخدام لوحة المفاتيح للتنقّل بينها. بالإضافة إلى استخدام مفتاحَي الانتقال للأعلى وللأسفل للتمرير للأعلى وللأسفل، يمكنك أيضًا استخدام مفتاحَي الانتقال لليسار ولليمين لفتح السجلات المُدمجة وإغلاقها.
  3. يتم الآن عرض تفاصيل الوقت في لوحة على يسار أي إدخال اخترته. (يمكنك أيضًا تمرير مؤشر الماوس فوق الإدخالات الأخرى للحصول على معلوماتها).

لنلقِ الآن نظرة على درج وحدة التحكّم. لفتح أدراج وحدة التحكّم، اضغط على مفتاح Escape من داخل "أدوات المطوّر" أو انقر على زر أدراج وحدة التحكّم رمز الدرج وسيتم ملف أدراج وحدة التحكّم من الأسفل.

ستظهر لك علامتَا التبويب Console وبحث Google تلقائيًا. للوصول إلى الوظيفة التي كانت تُعرف سابقًا باسم "عمليات الاستبدال"، افتح إعدادات DevTools وضَع علامة في المربّع بجانب "عرض "محاكاة" في أدراج وحدة التحكّم". أغلِق مربّع الإعدادات وستظهر لك علامة التبويب الاستنساخ في أدراج وحدة التحكّم، كما هو موضّح في لقطة الشاشة هنا:

درج وحدة التحكّم والإلغاءات

ويمكنك إجراء جميع عمليات المحاكاة هناك.

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

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

إنّ مساحات العمل على وجه الخصوص هي ميزة يمكنها تبسيط سير عمل التأليف إلى حدٍ كبير، ومع ذلك لا تحظى بالاهتمام الذي تستحقه. باستخدام مساحات العمل، يمكنك إجراء تغييرات في "أدوات مطوّري البرامج" وعرضها في المتصفّح وحفظها في ملف محلي دائم من ملفاتك، وكل ذلك بدون مغادرة Chrome، بدلاً من إجراء تجارب وإجراء تغييرات في "أدوات مطوّري البرامج" ونسخ التغييرات ولصقها مرة أخرى في ملفاتك المصدر.

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

إضافة ملفات بسهولة أكبر

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

أضِف المجلد إلى مساحة العمل.

إنشاء الملفات وإزالتها

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

ملف جديد

يمكنك أيضًا إزالة الملفات من داخل "مساحات العمل". انقر بزر الماوس الأيمن على ملف في لوحة "المصادر" على يمين الصفحة واختَر حذف الملف.

أزِل الملف.

يمكنك أيضًا تكرار ملف عن طريق اختيار تكرار الملف.

إعادة تحميل

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

يكون هذا الإجراء مفيدًا أيضًا إذا غيّرت ملفاتك المفتوحة في محرِّر آخر وكنت تريد ظهور التغييرات في أدوات مطوّري البرامج.

البحث في جميع الملفات

لقد حسّنا واجهة البحث في جميع الملفات قليلاً، وأصبح بإمكانك الآن البحث أيضًا عن سلاسل في جميع الملفات في مساحات العمل بالإضافة إلى جميع الملفات المحمَّلة في DevTools. يمكنك البحث عن سلسلة أو تعبير عادي، وسنطابق كلّ مرّة يظهر فيها التعبير في كلّ ملف أو صفحة. للبحث في ملفات متعددة في Workspaces (متوفّر حاليًا في الإصدار Canary):

  • افتح أدراج وحدة التحكّم من خلال الضغط على مفتاح Escape، ثم انقر على علامة التبويب بحث بجانب وحدة التحكّم لفتح نافذة "البحث".

أو

اضغط على Ctrl + Shift + F (Cmd + Opt + F على أجهزة Mac) لفتح نافذة "بحث Google".

  • اكتب طلب البحث في مربّع مصادر البحث، واضغط على مفتاح Enter. إذا كان طلب البحث عبارة عن تعبير عادي أو يجب أن يكون غير حساس لحالة الأحرف، انقر على المربّع المناسب.
البحث في جميع الملفات

قوائم التجاهل

يمكن أن يصبح البحث في نص الملفات أو الفلترة حسب أسماء الملفات مملًا جدًا إذا كانت لديك الكثير من ملفات ‎ .git أو ملفات README.md تؤدي إلى تشويش النتائج.

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

في ما يلي كيفية عرض قائمة التجاهل المشتركة الحالية وتغييرها في Workspaces:

  1. افتح إعدادات "أدوات مطوّري البرامج".
  2. انقر على مساحة العمل.
  3. ضمن شائع، في المربّع نمط استبعاد المجلد، يمكنك عرض و/أو تعديل الأنماط.
استبعاد أنماط الملفات

يتم شحن أنماط الاستبعاد الشاملة التلقائية التالية:

يستبعد التعبير العادي هذا البيانات الوصفية من Git وSVN وMercurial وملفات المشاريع من IDE Eclipse وIntelliJ وملفات OS X DS_Store وTrash وبعض الأشياء الأخرى التي يُنصح بتجاهلها، مثل ذاكرة التخزين المؤقت من Sass. يتم استبعاد المجلد بالكامل، بما في ذلك أي مجلدات فرعية، من واجهة المستخدم كي لا يظهر في واجهة المستخدم أو عند البحث في الملفات.

قوائم التجاهل الخاصة بمساحة العمل

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

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

  1. افتح إعدادات "أدوات مطوّري البرامج".
  2. انقر على مساحة العمل.
  3. ميِّز المجلد الذي يهمّك.
  4. انقر على تعديل وستظهر نافذة "تعديل نظام الملفات". يمكنك إضافة أو إزالة عمليات الربط و/أو المجلدات المستبعَدة من هذه النافذة.
استبعاد المجلدات