لأول مرة على الإطلاق، اجتمع جميع موردي المتصفحات الرئيسية والأطراف المعنية الأخرى معًا لحل أهم مشكلات توافق المتصفحات التي اكتشفها مطورو الويب. سيحسّن التشغيل التفاعلي لعام 2022 تجربة التطوير للويب في 15 مجالاً رئيسيًا. في هذه المقالة، اكتشف كيف وصلنا إلى هنا، وما الذي يركز عليه المشروع، وكيف سيتم قياس النجاح، وكيف يمكنك تتبع التقدم.
بدأت مسيرة النجاح في 2019
في عام 2019، بذلت كل من Mozilla وGoogle وشركات أخرى جهودًا كبيرة لفهم المشكلات لدى المطوّرين من خلال استطلاعات تقييم احتياجات المطوّرين لدى MDN وتقرير مدى توافق المتصفّح مع المحتوى بالتفصيل. قدّمت لنا هذه التقارير معلومات مفصّلة وقابلة للتنفيذ لمواجهة أهم التحديات التي يواجهها المطوّرون في منصة الويب، وأدى ذلك إلى الجهود المبذولة في عام 2021.
وضع Compat 2021 أساسًا متينًا يتضمّن العديد من الميزات الفعّالة، مثل شبكة CSS (استخدام بنسبة% 12 ونمو مستمرّ) وCSS flexbox (استخدام% 77)، بما في ذلك سمة gap في flexbox، التي تحلّ أكثر الصعوبات التي يواجهها المطوّرون عند اعتماد أساليب تصميم جديدة.
سررنا بتحقيق نتيجة تزيد عن%90 في جميع عمليات التنفيذ بنهاية عام 2021.
ما هو التشغيل التفاعلي لعام 2022؟
تمثّل ميزة التشغيل التفاعلي لعام 2022 معيارًا اتفق عليه ممثلون عن ثلاثة تطبيقات رئيسية للمتصفّحات، وتم تطويرها من خلال عملية ترشيح عامة ومراجعتها بالاستناد إلى ملاحظات الداعمين Apple وBocoup وGoogle وIgalia وMicrosoft وMozilla.
يركّز مقياس الأداء على 15 مجالاً يحدّدها المطوّرون على أنّها مزعجة بشكل خاص عند عدم توفّرها أو حدوث مشاكل عدم توافق فيها على المتصفّحات. لقد وافق جميع موردي المتصفحات على التركيز على هذه المجالات، وجميع المعنيين يسعدهم البدء في تحسين تجربة التطوير للويب بشكل يمكن قياسه.
المجالات الـ 15 التي يجب التركيز عليها
سيتم التركيز على الميزات التالية خلال عام 2022. وتشمل 10 مناطق جديدة، بالإضافة إلى 5 مناطق تم ترحيلها من Compat لعام 2021. وتتمثل المجالات الجديدة في ما يلي:
تتالي الطبقات
تمنح الطبقات المتتالية مطوّري برامج الويب مزيدًا من التحكّم في السلسلة. وتوفر طريقة لتجميع أدوات الاختيار في طبقات، ولكل منها خاصيتها. وهذا يعني أنّك لست بحاجة إلى ترتيب أدوات الاختيار بعناية أو إنشاء أدوات اختيار محدّدة للغاية لاستبدال قواعد CSS الأساسية.
مساحات الألوان ودوال لون CSS
لاستخدام دوال الألوان في نظام تصميم، تحتاج حاليًا إلى الاعتماد على Sass أو PostCSS أو calc() على قيم HSL. تعني دوال الألوان المضمّنة في CSS أنه يمكن تحديث الألوان ديناميكيًا، كما أن مساحات الألوان الجديدة تزيل القيد على سلسلة sRGB، كما أن القيود الإدراكية لـ HSL.
هناك دالتان محدّدتان في المستوى 5 من لون CSS تتيحان وضع تصاميم أكثر ديناميكية على النظام الأساسي للويب:
color-mix(): يستخدم لونين ويعرض نتيجة مزجهما في مساحة لون محددة بقيمة محددة.color-contrast(): للاختيار من قائمة الألوان ذات أعلى درجة تباين مع لون واحد محدّد.
تدعم هذه الدوال مساحات الألوان الموسَّعة (LAB وLCH وP3)، بالإضافة إلى HSL وsRGB، وهي تستخدم بشكل افتراضي مساحة لون LCH الموحّدة.
وحدات إطار عرض جديدة
تبرز صعوبات التعامل مع حجم إطار العرض في كل من تقرير توافق متصفّح MDN لعام 2020 واستطلاع حالة خدمة CSS لعام 2021 الجديد. تضيف قيم ووحدات CSS في المستوى 4 وحدات جديدة لأحجام إطار العرض الأكبر والأصغر وديناميكية، وهي lv* وsv* وdv*. ستسهّل هذه الوحدات إنشاء تنسيقات تملأ إطار العرض المرئي على الأجهزة الجوّالة مع وضع شريط العناوين في الاعتبار.
بالإضافة إلى ذلك، سيتعاون الفريق من مورّدي الخدمات الذين يستخدمون نظام التشغيل التفاعلي لعام 2022 في إجراء بحث وتحسين حالة التشغيل التفاعلي لميزات قياس إطار العرض الحالية، بما في ذلك وحدة vh الحالية.
الانتقال
يؤكّد تقرير "الاستطلاع الخاص بالتمرير لعام 2021" أنّه من الصعب تنفيذ ميزات التمرير وتوافق التمرير، وأنّها تتضمن العديد من الجوانب التي يمكن تحسينها. سنركّز على الالتقاط أثناء التنقّل وسلوك الانتقال وسلوك الانتقال الزائد للمساعدة في التنقّل بين المنتجات بسلاسة أكبر على مختلف الأنظمة الأساسية.
نحن نستكشف أيضًا اقتراحات جديدة لميزات ميزة "التمرير السريع".
الشبكة الفرعية
تعني قيمة subgrid الخاصة بـ grid-template-columns وgrid-template-rows أنّ عنصر الشبكة الذي تم تطبيق display: grid عليه يمكن أن يكتسب تعريف المسار من جزء الشبكة الرئيسية الذي يتم وضعه فوقه.
على سبيل المثال، تحتوي مكونات البطاقات الثلاثة التالية على رأس وتذييل تتماشى مع رؤوس وتذييلات البطاقات المتجاورتين، على الرغم من أن كل بطاقة تحتوي على شبكة مستقلة. يعمل هذا النمط لأن كل بطاقة عبارة عن عنصر يمتد إلى ثلاثة صفوف من الشبكة الرئيسية، ثم يستخدم شبكة فرعية لاكتساب تلك الصفوف في البطاقة.
مضمّنة أيضًا
- احتواء خدمة مقارنة الأسعار (CSS) (السمة
contain) - العنصر
<dialog> - عناصر التحكُّم في النموذج
- أسلوب الخط والترميزات: بما في ذلك
font-variant-alternatesوfont-variant-positionووحدةicوترميزات النص CJK - توافق الويب، الذي يركّز على الاختلافات بين المتصفحات التي تسبّبت في حدوث مشاكل متعلّقة بتوافق الموقع الإلكتروني تؤثر في المستخدمين النهائيين
أحرزت المجالات التالية تقدّمًا كبيرًا من خلال مشروع Compat 2021، ولكن لا يزال هناك مجال للتحسين. لهذا السبب، تم تضمينها في مبادرة Interop 2022 ليتم حلّ المشاكل المتبقية.
- نسبة العرض إلى الارتفاع
- صندوق مرنة
- معرّف الإصدار العالمي (GRid)
- تحديد الموضع الثابت
- المحولات
جهود التحقيق
بالإضافة إلى المجالات التي يتم التركيز عليها والتي يبلغ عددها 15، تتضمّن خدمة Interop 2022 ثلاثة جهود للتحقيق. هذه هي المجالات التي تمثّل مشاكل وبحاجة إلى تحسين، ولكن حيث لا تكون الحالة الحالية للمواصفات أو الاختبارات جيدة بما يكفي للتمكّن من تسجيل مستوى التقدّم باستخدام نتائج الاختبار:
- التعديل،
contenteditableوexecCommand - أحداث المؤشر والماوس
- قياس إطار العرض
سيتعاون مورّدو المتصفحات والجهات المعنية الأخرى على تحسين الاختبارات والمواصفات لهذه المجالات، بحيث يمكن تضمينها في التكرارات المستقبلية لهذا الجهد.
قياس النجاح وتتبع التقدم
سيتم استخدام لوحة بيانات اختبارات المنصات على الويب الحالية لتتبُّع مستوى التقدّم في مجالات التركيز الخمسة عشر. وتم تحديد مجموعة من الاختبارات لكل مجال. بعد ذلك، يتم تقييم المتصفحات مقابل هذه الاختبارات، ما يؤدي إلى تقديم نتيجة لكل منطقة ونتيجة إجمالية لجميع المجالات الـ 15.
لمتابعتك وتتبُّع مستوى التقدّم، يمكنك الاطّلاع على لوحة بيانات Interop 2022. على مدار العام، يمكنك المتابعة ومعرفة كيفية تحسين المنصة التي يتم إنشاؤها من أجلها.
ماذا يعني كلّ ذلك بالنسبة إلى المطوّرين؟
من خلال جهود إمكانية التشغيل التفاعلي على مدار عدة سنوات، تم إصدار مبادرة Compat 2021 و Interop 2022 وغيرها الكثير، وهي تهدف إلى الإقرار بشكل كامل بالمشاكل التي واجهها المطوّرون لسنوات عديدة والتي واجهوها. ولم يكن الأمر عبارة عن جهد من متصفح واحد، بل هو تعاون قوي بين جميع موردي المتصفحات الرئيسية والأصدقاء من أجل تحسين النظام الأساسي للويب على جميع الخدمات.
الهدف الأساسي من ذلك هو جعل النظام الأساسي للويب أكثر قابلية للاستخدام وموثوقية للمطوّرين، بحيث يمكنهم قضاء المزيد من الوقت في إنشاء تجارب ويب رائعة بدلاً من التعامل مع التناقضات في المتصفّح.
يسرنا أن نعرف رأيك
يسرّنا معرفة ملاحظاتك بشأن التحسينات التي أجريتها خلال فعالية Compat 2021 أو على أي من الميزات المضمَّنة في Interop 2022. أي من هذه الميزات ستحدث أكبر فرق في عملك؟ ما الذي يثير حماستك حقًا؟ يمكنك إبلاغنا بالمشاكل في مستودع GitHub أو إعلامنا بذلك على Twitter.
تعرَّف على مزيد من المعلومات حول التشغيل التفاعلي لعام 2022 من: