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

نسخ أنماط العناصر

انقر بزر الماوس الأيمن على عقدة في شجرة DOM لنسخ CSS لعقدة DOM إلى الحافظة.

نسخ الأنماط

الشكل 1. نسخ أنماط العناصر

شكرًا آدم أرجيل وVisBug على الإلهام.

عرض متغيّرات التصميم

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

يمكن أن تساعدك "أدوات مطوّري البرامج" الآن في رصد متغيّرات التصميم:

  1. افتح قائمة الأوامر.
  2. ابدأ الكتابة Rendering.
  3. شغِّل الأمر إظهار العرض.
  4. ضَع علامة في مربّع الاختيار مناطق متغيّرات التصميم. أثناء تفاعلك مع صفحة ما، يتم تمييز متغيّرات التصميم باللون الأزرق.

متغيّر التصميم

الشكل 2. متغيّر التصميم

مشكلة Chromium رقم 961846

Lighthouse 5.1 في لوحة "عمليات التدقيق"

تستخدم لوحة "التدقيق" الآن Lighthouse 5.1. تشمل عمليات التدقيق الجديدة ما يلي:

  • توفّر سمة apple-touch-icon صالحة. تتحقق من إمكانية إضافة تطبيق ويب تقدّمي (PWA) إلى الشاشة الرئيسية في نظام التشغيل iOS.
  • احرص على أن تكون أعداد الطلبات وأحجام الملفات منخفضة. يقدم تقارير عن العدد الإجمالي لطلبات الشبكة وأحجام الملفات لفئات مختلفة، مثل المستندات والنصوص البرمجية وأوراق الأنماط والصور وما إلى ذلك.
  • الحد الأقصى المُحتمَل لمهلة الاستجابة الأولى: يقيس الحد الأقصى للوقت المحتمل بين تفاعل المستخدم مع الصفحة الأولى واستجابة المتصفح لهذا التفاعل. يُرجى العلم أنّ هذا المقياس يحلّ محلّ مقياس "وقت الاستجابة المقدّر" إنّ الحدّ الأقصى المحتمَل لـ "مهلة الاستجابة الأولى" لا يؤثّر في نتيجة فئة الأداء.

واجهة المستخدم الجديدة للوحة "عمليات التدقيق"

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

تتضمّن إصدارات Node وCLI من Lighthouse 5.1 3 ميزات رئيسية جديدة تستحق التحقّق منها:

  • ميزانيات الأداء: يمكنك منع تراجع موقعك الإلكتروني بمرور الوقت من خلال تحديد أعداد الطلبات وأحجام الملفات التي يجب ألّا تتجاوزها الصفحات.
  • المكوّنات الإضافية: يمكنك زيادة إمكانات Lighthouse من خلال عمليات التدقيق المخصّصة.
  • حزم الحزم: يمكنك إضافة عمليات تدقيق مصمّمة خصيصًا لحِزم تكنولوجيا معيّنة. يتم شحن حزمة حزم WordPress أولاً. كل من React وAMP Stack Pack قيد التطوير.

مزامنة مظهر نظام التشغيل

إذا كنت تستخدم المظهر الداكن في نظام التشغيل، ستنتقل "أدوات مطوري البرامج" الآن إلى المظهر الداكن الخاص بها تلقائيًا.

اختصار لوحة المفاتيح لفتح "محرِّر نقاط الإيقاف"

اضغط على Control+Alt+B أو Command+Option+B (Mac) عند التركيز على المحرّر في لوحة المصادر لفتح محرِّر نقاط الإيقاف. استخدِم "محرِّر نقاط الإيقاف" لإنشاء نقاط تسجيل ونقاط إيقاف شرطية.

محرِّر نقاط الإيقاف.

الشكل 4. محرِّر نقاط الإيقاف

الجلب المسبق لذاكرة التخزين المؤقت في لوحة "الشبكة"

أصبح عمود الحجم في لوحة "الشبكة" يعرض الآن (prefetch cache) عند تحميل مورد من ذاكرة التخزين المؤقت للجلب المُسبَق. الجلب المسبق هو ميزة جديدة لمنصة الويب تهدف إلى تسريع عمليات التحميل اللاحقة للصفحات. تشير علامة هل يمكنني استخدام... إلى أنّها متوافقة مع 83.33% من المتصفّحات العالمية اعتبارًا من تموز (يوليو) 2019.

عمود "الحجم" يوضّح أنّ الموارد مصدرها ذاكرة التخزين المؤقت للجلب المُسبَق.

الشكل 5. يوضّح عمود الحجم أنّ prefetch2.html وprefetch2.css مصدرهما (prefetch cache).

يمكنك الاطّلاع على العرض التوضيحي للجلب المُسبَق لتجربته.

مشكلة Chromium رقم 935267

الخصائص الخاصة عند عرض العناصر

تعرض وحدة التحكّم الآن حقول الفئة الخاصة في معاينات الكائنات.

عند فحص عنصر، تعرض وحدة التحكّم الآن حقولاً خاصة مثل " #color".

الشكل 6. لا يعرض الإصدار القديم من Chrome على اليمين الحقل #color عند فحص الكائن، بينما يعرضه الإصدار الجديد على اليمين.

الإشعارات ورسائل الدفع في لوحة التطبيق

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

وكما هي الحال مع ميزتَي "الجلب في الخلفية" و"مزامنة الخلفية" من Chrome 76، فبعد بدء التسجيل، يتم تسجيل الرسائل الفورية والإشعارات على هذه الصفحة لمدة 3 أيام، حتى عند إغلاق الصفحة وحتى عند إغلاق Chrome.

اللوحتان الجديدتان "الإشعارات" و"الرسائل الفورية"

الشكل 7. لوحات الرسائل والإشعارات الفورية في لوحة التطبيق.

مشكلة Chromium رقم 927726

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

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