اكتشِف بعض الميزات الرائعة التي تمت إضافتها إلى متصفّحات الويب الثابتة والتجريبية خلال شهر أيار (مايو) 2024.
إصدارات المتصفّح المستقرة
في أيار (مايو) 2024، أصبح كل من Firefox 126 وSafari 17.5 وChrome 125 ثابتًا. تتناول هذه المشاركة الميزات الجديدة التي تمت إضافتها إلى النظام الأساسي للويب.
تحديد موضع إعلان CSS الثابت
يتضمّن Chrome 125 إمكانية تحديد موضع الإرساء في CSS. ويتيح لك ذلك ربط عنصر ذي موضع مطلق بعنصر آخر أو أكثر على الصفحة (علامات الارتساء)، بطريقة تعريفية، بدون استخدام JavaScript. يعمل تحديد موضع الإرساء بشكل جيد عندما تكون علامات الارتساء قابلة للتمرير. تتمثل حالة الاستخدام الشائعة في وضع نافذة منبثقة مثل تلميح بجوار العنصر الذي استدعاه، أو قائمة تحديد وقائمة خيارات النافذة المنبثقة الخاصة بها.
يمكنك الاطّلاع على المزيد من المعلومات في المقالة التعرّف على واجهة برمجة تطبيقات تحديد مواضع الإعلانات الثابتة في CSS.
دوال القيم المتدرجة في CSS: round() وmod() وrem()
يشتمل إصدار Chrome 125 أيضًا على دوال القيم المدرّجة، ما يعني أنّ هذه الدوال أصبحت الآن
تتوفر خط الأساس. دوال القيمة المتدرجة، round() وmod() وrem()، تعمل جميعها على تحويل قيمة معيّنة وفقًا لـ "قيمة خطوة" أخرى.
يمكنك الاطّلاع على مزيد من المعلومات في مقالة أصبحت الدوال الحسابية ذات القيمة المتدرجة في CSS متوفّرة الآن في Baseline 2024.
الدالة light-dark()
ستنضم القاعدة الأساسية أيضًا إلى دالة لون CSS light-dark()،
الموجودة في Safari 17.5.
light-dark() هي دالة تقبل وسيطتين، وكلاهما يجب أن يكون <color>. يتم اختيار أحدهما بناءً على نظام الألوان المستخدم.
- إذا كان نظام الألوان المستخدَم هو
lightأو غير معروف، يتم عرض القيمة المحسوبة للقيمة الأولى. - إذا كان نظام الألوان المستخدَم هو
dark، يتم عرض القيمة المحسوبة للون الثاني.
يمكنك الاطّلاع على المزيد من المعلومات في الألوان التي تعتمد على الألوان في CSS باستخدام light-dark() .
واجهة برمجة تطبيقات Screen Wake Lock
وقد أصبح الوصول إلى الإصدار 126 من Firefox هو واجهة برمجة تطبيقات Screen Wake Lock API، وهي ميزة أخرى أصبحت الآن جزءًا من Baseline (متاحة حديثًا). توفّر واجهة برمجة التطبيقات هذه طريقة لمنع تعتيم الشاشة وقفلها.
تعرَّف على كيفية استخدام هذه الميزة في صفحة البقاء في الوضع النشط باستخدام واجهة برمجة تطبيقات Screen Wake Lock API.
واجهة برمجة تطبيقات Compute Pressure
تقدم واجهة برمجة التطبيقات Compute Pressure حالات عالية المستوى تمثل حِمل وحدة المعالجة المركزية (CPU) على النظام. وهو يسمح للتنفيذ باستخدام مقاييس الأجهزة الأساسية المناسبة لضمان استفادة المستخدمين من جميع إمكانات المعالجة المتاحة لهم طالما أن النظام لا يخضع لضغوط لا يمكن إدارتها.
تتوفّر هذه الميزة في الإصدار 125 من Chrome. قادت Intel عمليات التصميم والتنفيذ لواجهة برمجة التطبيقات هذه، والتي ستتيح لتطبيقات اجتماعات الفيديو التوازن الديناميكي بين الميزات والأداء.
اطّلِع على مستندات The Compute Pressure API.
قاعدة @starting-style
يتضمّن Safari 17.5 القاعدة @starting-style. تتيح لك قاعدة CSS هذه تطبيق نمط يمكن للمتصفح البحث عنه قبل فتح العنصر على الصفحة، وذلك حسب الحاجة في الرسوم المتحركة للإدخال.
قاعدة @starting-style هي إحدى الميزات المشمولة في أربع ميزات جديدة من CSS للدخول السلس عند إنشاء الصور المتحركة والخروج منها.
إصدارات المتصفّح التجريبي
وتتيح لك الإصدارات التجريبية من المتصفّح إمكانية معاينة الميزات التي ستظهر في الإصدار المستقر التالي من المتصفّح. الوقت مناسب لاختبار الميزات الجديدة أو عمليات الإزالة التي قد تؤثر في موقعك الإلكتروني قبل طرح هذا الإصدار حول العالم. الإصدارات التجريبية الجديدة هي Firefox 127 وChrome 126. توفّر هذه الإصدارات العديد من الميزات الرائعة على المنصة. تحقق من ملاحظات الإصدار للحصول على جميع التفاصيل. إليك بعض الأمثلة البارزة.
يتضمّن Chrome 126 عمليات انتقال عرض متعددة المستندات لعمليات الانتقال من المصدر نفسه. في السابق، كان عليك إعادة تصميم موقعك الإلكتروني ليصبح SPA لاستخدام واجهة برمجة التطبيقات View Transitions API. لقد اختلف الوضع اليوم. يتم الآن تفعيل عمليات نقل الملف الشخصي تلقائيًا لعمليات الانتقال من المصدر نفسه. يمكنك إنشاء عرض انتقال بين مستندَين مختلفَين يحملان المصدر نفسه.
يتضمّن Firefox 127 طُرقًا إضافية لضبط JavaScript، مثل intersection() وunion() وdifference()
وsymmetricDifference() وisSubsetOf() وisSupersetOf() وisDisjointFrom().