تحسينات على أدوات مطور F12 في Internet Explorer 11

التغييرات في واجهة مستخدم F12

الأيقونات والإعلامات الجديدةتغيير أيقونات أدوات الذاكرة وملف التعريف.

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

يشبه التنقل بين مجموعة F6 الفائقة داخل الأدوات استخدام المفتاح F6 للتنقل حول أداة، ولكنه "يتنقل" من خلال مجموعة محددة من العناصر الأكثر استخداما في جزء الأدوات بدلا من كل عنصر قابل للتحديد. هذا جزء من نظام أنظف شامل لاستخدام لوحة المفاتيح للتنقل داخل الأدوات وفيما بينها.

الانتقال ذهابا وإيابا بين الأدوات المستخدمة مؤخرا باستخدام لوحة المفاتيح يمكنك استخدام Ctrl + [ للانتقال إلى الخلف في محفوظات التنقل بين الأدوات وCTRL + ] للانتقال إلى الأمام، على غرار الأسهم الخلفية والمتقدمة عند الاستعراض.

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

تغييرات وحدة التحكم

Console.timeStamp()عند استدعاؤه من وحدة التحكم أو ضمن التعليمات البرمجية، يقوم Console.timeStamp() بمخرجات وحدة التحكم عدد المللي ثانية التي تم فتح علامة تبويب المستعرض الحالية فيها. إذا تم استدعاؤها أثناء تشغيل جلسة عمل جمع معلومات باستخدام أداة استجابة واجهة المستخدم، فإنها تنشئ علامة مستخدم على المخطط الزمني للجلسة جنبا إلى جنب مع طابع زمني استنادا إلى الوقت منذ بدء الجلسة.

Ctrl + L يمسح وحدة تحكم جميع الرسائل

الإكمال التلقائي الدقيقالإكمال التلقائي لوحدة التحكم لم يعد يتضمن خصائص المفهرس. يؤدي هذا إلى اختيار أكثر نظافة ودقة لاقتراحات الإكمال التلقائي.

تمت إضافة $و$$$x و0-$5 و$_ إلى قائمة الإكمال التلقائي لوحدة التحكم للراحة، ولجعل سلوك وحدة التحكم أكثر اتساقا مع المستعرضات الأخرى.

مؤشر رسالة قديم إذا اخترت إيقاف تشغيل الخيار مسح عند التنقل، فإن أيقونات رسائل وحدة التحكم القديمة غير نشطة للمساعدة في التمييز بين رسائل الصفحة النشطة والرسائل من الصفحات السابقة في المحفوظات.

تغييرات مستكشف DOM

تغيير الأشرطة في الجزء المحسوبتظهر أشرطة التغيير (ألوان مختلفة للخصائص المتغيرة والخصائص المضافة والخصائص المحذوفة) التي يتمتع بها المستخدمون في جزء الأنماط الآن في جزء الأنماط المحسوبة.

تغييرات مصحح الأخطاء

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

الإكمال التلقائي في WatchesNow، عند إضافة ساعة، يتم اقتراح خيارات الإكمال التلقائي لك.

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

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

function showval() { var x = 0; x++; debugger; return x; } showval(); 

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

يمكن استخدام التحديد المتعدد لنقاط التوقفCtrl + النقر، Shift + النقر، وCtrl + A لتحديد نقاط توقف متعددة في جزء نقاط التوقف.

تابع واتجاهل breaksPress F5 للمتابعة إلى الفاصل التالي. اضغط باستمرار على F5 لمتابعة الفواصل المتعددة السابقة حتى تحرر F5.

نقاط توقف الأحداث ونقاط التتبعيعمل على غرار نقاط التوقف ونقاط التتبع الموجودة بالفعل في أدوات F12، ولكن بدلا من تشغيلها عند تنفيذ كتلة معينة من التعليمات البرمجية، يتم تشغيلها عند تشغيل حدث معين. يحتوي كل منها على عامل تصفية شرطي اختياري لمساعدتك على تضييق نطاقه إلى مثيل معين لحدث تريد فحصه. يمكن إضافتها باستخدام رمزي Add event tracepoint وAdd event breakpoint المميزين في الصورة التالية:

تغييرات أداة استجابة واجهة المستخدم

جلسات أداء الاستيراد/التصدير يجب ألا تحتاج إلى إعادة إنتاج حالة الاختبار في كل مرة تريد فيها تحليل البيانات التي تنتجها أو مشاركة تلك البيانات مع زميل. تتيح لك أيقونات الاستيراد (المجلد) والتصدير (القرص) على شريط أيقونات أداة استجابة واجهة المستخدم حفظ لقطات الذاكرة في ملف يمكن استيراده لاحقا.

معاينة الصورة إذا رأيت طلب HTTP لصورة وتساءلت عن الصورة التي كانت عليها، يتم الآن معاينة الصورة في تفاصيل الحدث.

أحداث التصفيةزر أحداث التصفية صغير ولكنه قوي. يتم إخفاء خلف هذا الزر قائمة تتيح لك تصفية الأحداث بطرق متعددة، ولكل طريقة تأثير كبير:

• عامل تصفية اسم الحدث: تصفية لأي اسم حدث يحتوي على تطابق لنص عامل التصفية.

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

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

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

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

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

التلوين ل DOMThis الميزة يضيف التلوين إلى عناصر DOM والأحرف الحرفية للسلسلة والقيم الحرفية للرقم. بصرف النظر عن جعل المحتوى داخل أدوات F12 المختلفة يبدو ويتصرف بشكل أكثر تشابها، فإنه يضيف المزيد من الاهتمام المرئي إلى أداة استجابة واجهة المستخدم.

ملخص التحديد عند تحديد جزء من المخطط الزمني، سيظهر جزء تفاصيل الحدث ملخصا للتحديد. مرر مؤشر الماوس فوق مقاطع مختلفة من المخطط الدائري للحصول على تلميح أدوات مع فئة حدث المقطع.

دعم console.timeStamp()يؤدي استخدام أسلوب console.timeStamp() في التعليمات البرمجية أو في وحدة التحكم أثناء جلسة جمع المعلومات إلى إنشاء علامة مستخدم على المخطط الزمني الذي يحتوي على الوقت منذ بدء جلسة عمل جمع المعلومات.

تغييرات أداة الذاكرة

يساعد طي الطغيان القابل للطي على تبسيط محتويات اللقطة عن طريق إزالة الكائنات من طرق عرض المستوى الأعلى التي هي مكونات منطقية لعنصر آخر (على سبيل المثال،> BR <داخل> DIV <، وهو نطاق يتم الاحتفاظ به بواسطة دالة) ويميل إلى أن يكون تفاصيل إضافية لا تحسن رؤيتك في البيانات، ولكن يمكن أن تضيع وقتك. 

على سبيل المثال، تظهر الصورة التالية قبل وبعد طرق العرض، مما يوضح كيف يعمل طي المسيطر على تحسين "القصة" التي تقولها الأداة. تعرض طريقة العرض المطوية 30 HTML <DIV>، والتي تمثل 15.64 ميغابايت من الذاكرة، وتتمسك بعقد DOM المنفصلة. في كثير من الحالات، ليس من المهم معرفة تكوين كائن، بقدر ما تعلم ببساطة أنه كبير جدا أو أنه يتسرب (خاصة عند استخدام مكتبات الجهات الخارجية).

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

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

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

تغييرات أداة المحاكاة

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