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

أدوات جديدة لتصحيح أخطاء flexbox في CSS

يحتوي "أدوات مطوّري البرامج" الآن على أدوات مخصّصة لتصحيح أخطاء flexbox في CSS.

أدوات تصحيح أخطاء flexbox في CSS

عند تطبيق display: flex أو display: inline-flex على عنصر HTML على صفحتك، يمكنك رؤية شارة flex بجانبه في لوحة "العناصر". انقر فوق الشارة لتبديل عرض تراكب مرن على الصفحة.

في لوحة الأنماط، يمكنك النقر على الرمز الجديد بجانب display: flex أو display: inline-flex لفتح محرِّر Flexbox. يوفر محرر Flexbox طريقة سريعة لتحرير خصائص flexbox. جربه بنفسك!

بالإضافة إلى ذلك، يشتمل جزء التنسيق على قسم Flexbox، وهو يعرض جميع عناصر flexbox على الصفحة. يمكنك تبديل تراكب كل عنصر.

قسم Flexbox في جزء التخطيط

مشاكل Chromium: 1166710 و1175699

عنصر مركّب جديد في "مؤشرات أداء الويب الأساسية"

يمكنك عرض أداء صفحاتك بشكل مرئي وقياسه بشكل أفضل من خلال العنصر الجديد المركّب في "مؤشرات أداء الويب الأساسية".

مؤشرات أداء الويب الأساسية هي مبادرة أطلقتها Google لتقديم إرشادات موحّدة لإشارات الجودة الضرورية لتقديم تجربة رائعة للمستخدمين على الويب.

افتح قائمة الأوامر، وشغِّل الأمر إظهار العرض، ثم فعِّل مربّع الاختيار مؤشرات الويب الأساسية.

يعرض الإعلان المركّب حاليًا ما يلي:

  • سرعة عرض أكبر محتوى مرئي (LCP): يقيس هذا المقياس أداء التحميل. لتقديم تجربة جيدة للمستخدمين، يجب أن يحدث مقياس LCP خلال 2.5 ثانية من وقت بدء تحميل الصفحة لأول مرة.
  • مهلة الاستجابة الأولى (FID): يقيس التفاعل. لتقديم تجربة جيدة للمستخدمين، يجب أن يبلغ مقياس FID للصفحات أقل من 100 ملّي ثانية.
  • متغيّرات التصميم التراكمية (CLS): تقيس الثبات البصري. لتقديم تجربة جيدة للمستخدم، يجب أن تحافظ الصفحات على أقل من 0.1 في متغيّرات التصميم التراكمية (CLS).

المحتوى المركّب في "مؤشرات أداء الويب الأساسية"

مشكلة Chromium: 1152089

آخر الأخبار في علامة التبويب "المشاكل"

تم نقل عدد المشاكل إلى شريط الحالة في وحدة التحكّم.

تمت إضافة زر جديد لعدد المشاكل في شريط حالة وحدة التحكّم لتحسين مستوى عرض التحذيرات بشأن المشاكل. سيؤدي هذا الإجراء إلى استبدال رسالة المشكلة في وحدة التحكّم.

عدد المشاكل في شريط الحالة في وحدة التحكّم

مشكلة Chromium: 1140516

الإبلاغ عن مشاكل بشأن النشاط الموثوق به على الويب

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

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

مشاكل متعلقة بنشاط الويب الموثوق به في علامة التبويب "المشاكل"

مشكلة Chromium: 1147479

تنسيق السلاسل كأعداد حرفية لسلسلة JavaScript (صالحة) في وحدة التحكّم

والآن، تعمل وحدة التحكّم على تنسيق السلاسل كسلاسل حرفية صالحة لسلسلة JavaScript في وحدة التحكّم. في السابق، لم تكن وحدة التحكّم تتخطّى علامات الاقتباس المزدوجة عند طباعة السلاسل.

تنسيق السلاسل كأعداد حرفية لسلسلة JavaScript (صالحة)

مشكلة Chromium: 1178530

لوحة الرموز المميّزة الموثوق بها الجديدة في لوحة التطبيق

تعرض "أدوات مطوّري البرامج" الآن جميع الرموز المميّزة Trust Token المتاحة في سياق التصفّح الحالي في لوحة الرموز المميّزة الثقة الجديدة ضمن لوحة التطبيق.

Trust Token هي واجهة برمجة تطبيقات جديدة للمساعدة في مكافحة الاحتيال وتمييز برامج التتبُّع عن الأشخاص الحقيقيين بدون تتبُّع سلبي. تعرَّف على كيفية بدء استخدام الرموز المميّزة Trust Token.

الجزء الجديد من الرموز المميّزة الموثوق بها

مشكلة Chromium: 1126824

محاكاة ميزة وسائط color-gamut لصفحات الأنماط المتتالية (CSS)

محاكاة ميزة وسائط color-gamut لصفحات الأنماط المتتالية (CSS)

يتيح لك الاستعلام عن الوسائط color-gamut اختبار النطاق التقريبي للألوان التي يتيحها المتصفّح وجهاز إخراج. على سبيل المثال، إذا تطابق الاستعلام عن الوسائط color-gamut: p3، هذا يعني أنّ جهاز المستخدم يتيح مساحة اللون Display-P3.

افتح قائمة الأوامر، وشغِّل القائمة المنسدلة إظهار العرض، ثم اضبط الأمر محاكاة ميزة وسائط CSS باللون-gamut.

مشكلة Chromium: 1073887

أدوات محسَّنة لتطبيقات الويب التقدّمية

تعرض "أدوات مطوّري البرامج" الآن رسالة تحذيرية أكثر تفصيلاً بشأن إمكانية تثبيت تطبيقات الويب التقدّمية (PWA) في وحدة التحكّم، بالإضافة إلى رابط يؤدي إلى المستندات.

تحذير بشأن إمكانية تثبيت تطبيق الويب التقدّمي (PWA)

تعرض لوحة البيان الآن رسالة تحذير إذا تجاوز عدد أحرف الوصف في البيان 324 حرفًا.

تحذير بشأن اقتطاع وصف PWA

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

تحذير بشأن لقطة شاشة من تطبيق الويب التقدّمي (PWA)

مشكلة Chromium: 1146450 و1169689 و965802

عمود Remote Address Space جديد في لوحة "الشبكة"

استخدِم عمود Remote Address Space الجديد في لوحة "الشبكة" لمعرفة مساحة عنوان IP للشبكة لكل مورد للشبكة.

عمود "مساحة العنوان البعيد" الجديد

مشكلة Chromium: 1128885

تحسينات الأداء

تم الآن تحسين أداء تحميل الصفحات أثناء فتح أدوات مطوّري البرامج. وفي بعض الحالات القصوى، لاحظنا تحسّنًا في الأداء بمقدار 10 مرات.

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

ابقَ متأهبًا للحصول على مشاركة مدونة هندسية أكثر تفصيلاً حول التنفيذ.

مشاكل Chromium: 1069425 و1077657

عرض الميزات المسموح بها/غير المسموح بها في طريقة عرض تفاصيل الإطار

يظهر في عرض تفاصيل الإطار الآن قائمة بميزات المتصفِّح المسموح بها وغير المسموح بها والتي يتم التحكّم فيها من خلال سياسة الأذونات.

سياسة الأذونات هي واجهة برمجة تطبيقات لمنصة الويب تتيح للمواقع الإلكترونية السماح باستخدام ميزات المتصفّح أو حظره في إطاره الخاص أو في إطارات iframe التي يدرجها.

الميزات المسموح بها/غير المسموح بها استنادًا إلى سياسة الأذونات

مشكلة Chromium: 1158827

عمود "SameParty" جديد في لوحة "ملفات تعريف الارتباط"

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

عمود SameParty

مشكلة Chromium: 1161427

إيقاف دعم fn.displayName غير العادي

تم إيقاف دعم fn.displayName غير العادية. يمكنك استخدام fn.name كبديل.

مثال على استخدام اسم العرض

في Chrome، عادةً ما أتاح استخدام السمة fn.displayName غير العادية كوسيلة تتيح للمطوّرين التحكّم في أسماء تصحيح الأخطاء للدوال التي تظهر في error.stack وفي عمليات تتبُّع تسلسُل استدعاء الدوال البرمجية في "أدوات مطوّري البرامج". في المثال أعلاه، كانت حزمة المكالمات تعرض سابقًا noLongerSupport.

استبدِل fn.displayName بـ fn.name العادي، الذي تم جعله قابلاً للضبط (عبر Object.defineProperty) في ECMAScript 2015 لاستبدال السمة fn.displayName غير العادية.

كان الدعم المقدَّم إلى fn.displayName غير موثوق به وغير متسق على مختلَف محركات المتصفحات. ويؤدي ذلك إلى إبطاء عملية جمع بيانات تتبُّع تسلسل استدعاء الدوال البرمجية، وهي تكلفة يدفعها المطوّرون دائمًا بغض النظر عما إذا كانوا يستخدمون fn.displayName أم لا.

مثال على استخدام الاسم

مشكلة Chromium: 1177685

إيقاف Don't show Chrome Data Saver warning نهائيًا في قائمة "الإعدادات"

تمت إزالة الإعداد Don't show Chrome Data Saver warning بسبب إيقاف ميزة "توفير البيانات في Chrome" نهائيًا.

إيقاف إعدادات "عدم عرض تحذير توفير بيانات Chrome"

مشكلة Chromium: 1056922

الميزات التجريبية

الإبلاغ التلقائي عن المشاكل المنخفضة التباين في علامة التبويب "المشاكل"

أضافت "أدوات مطوري البرامج" دعمًا تجريبيًا للإبلاغ عن مشاكل التباين في علامة التبويب "المشاكل" تلقائيًا.

النص المنخفض التباين هو مشكلة تسهيل الاستخدام الأكثر شيوعًا التي يمكن رصدها تلقائيًا على الويب. من خلال عرض هذه المشاكل في علامة تبويب "المشاكل"، يمكن للمطوّرين اكتشاف هذه المشاكل بسهولة أكبر.

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

الإبلاغ التلقائي عن مشاكل التباين المنخفض

مشكلة Chromium: 1155460

العرض التدرّجي للحساب الكامل لتسهيل الاستخدام في لوحة "العناصر"

يمكنك الآن التبديل لعرض العرض التدرّجي الجديد والمحسّن لإمكانية الوصول الكامل لإحدى الصفحات.

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

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

يُرجى العِلم أنّ هذه التجربة في مراحلها الأولى. نخطط لتحسين الوظائف وتوسيع نطاقها بمرور الوقت.

العرض التدرّجي للحساب المخصّص لتسهيل الاستخدام الكامل

مشكلة Chromium: 887173

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

يمكنك استخدام 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