جديد على منصة الويب في تموز (يوليو)

تعرَّف على بعض الميزات المثيرة للاهتمام التي تمت إضافتها إلى الإصدارين الثابت والتجريبي. في متصفّحات الويب خلال يوليو 2024.

إصدارات المتصفّح الثابتة

في يوليو 2024، كان Firefox 128 الإصدار 17.6 من Safari أصبح الإصدار 127 من Chrome ثابتًا. تتناول هذه المشاركة الميزات الجديدة التي تمت إضافتها إلى النظام الأساسي للويب.

بنية اللون النسبية في CSS

يتضمن الإصدار 128 من Firefox بنية الألوان النسبية في CSS، يتيح لك ذلك إنشاء لون نسبةً إلى لون المصدر. تُلغي خدمة CSS التالية تشبُّع اللون indigo بمقدار النصف باستخدام hsl().

.desaturate-by-half {
  background: hsl(from indigo h calc(s / 2) l);
}

دعم المتصفح

  • 119
  • 119
  • 128
  • 16.4

يمكنك العثور على المزيد من الأمثلة في مشاركة المدوّنة. بنية الألوان النسبية في CSS: تشكّل بنية الألوان النسبية أحد المجالات التي يجب التركيز عليها في أداة التشغيل المتداخل لعام 2024، ولذلك يساعد هذا التحديث في تحسين النتيجة لمتصفح Firefox الثابت.

نص بديل للسمة content

يتيح الإصدار 128 من Firefox استخدام نص بديل للسمة content CSS، عندما يتضمن صورة. يتم عرض النص البديل لشجرة تسهيل الاستخدام. يعني ذلك أنّ النص البديل متاح الآن في جميع متصفّحات content.

دعم المتصفح

  • 77
  • 79
  • 128
  • 17.4

يضمن التحديث في الإصدار 127 من Chrome قبول Chrome عددًا عشوائيًا من بدلاً من سلسلة واحدة فقط، ما يتيح استخدام السمة attr() على سبيل المثال.

السمة font-size-adjust

يشتمل الإصدار 127 من Chrome على font-size-adjust، وهو أيضًا مجال يركّز على أداة التشغيل المتداخل لعام 2024. هذه الخاصية مفيدة في الحالات التي يمكن فيها إجراء احتياطي للخط، حيث يساعدك في مطابقة حجم الخط الاحتياطي مع خط الاختيار الأول.

دعم المتصفح

  • 127
  • 127
  • 3
  • 16.4

المصدر

مع إصدار Chrome هذا، تصبح الخاصية font-size-adjust جزءًا من الإصدار المرجعي متوفّر حديثًا.

إتاحة واجهة برمجة التطبيقات View Transition API في إطارات iframe

بدءًا من عمليات الانتقال المتزامنة لعرض المستند نفسه في Chrome 127 في إطار رئيسي، وستتوفّر إطار iframe نفسه المصدر.

في السابق، لم يكن تشغيل الانتقال بين طرق العرض باستخدام document.startViewTransition في إطار iframe من المصدر نفسه يعمل إذا كان الإطار الرئيسي يشغّل عملية انتقال في الوقت نفسه. سيتم تخطّي انتقال iframe تلقائيًا. الآن، سيتم تنفيذ كلتا الانتقالتين.

حاويات التمرير التي يمكن التركيز عليها في لوحة المفاتيح

بدءًا من أشرطة التمرير في Chrome 127، يمكن التركيز على النقرات والتركيز عليها آليًا تلقائيًا. تكون أدوات التمرير، التي لا تحتوي على أطفال يمكن التركيز عليها، قابلة للتركيز تلقائيًا باستخدام لوحة المفاتيح.

يمكنك الاطّلاع على المزيد من المعلومات حول هذا التغيير في المشاركة. أشرطة التمرير التي يمكن التركيز عليها في لوحة المفاتيح:

قاعدة @property

يتيح الإصدار 128 من Firefox استخدام القاعدة @property ولغة JavaScript ذات الصلة واجهات برمجة التطبيقات. هذا يعني أنه يمكنك إنشاء خصائص CSS مخصصة تحدد بناء الجملة، واكتساب وقيمة أولية.

دعم المتصفح

  • 85
  • 85
  • 128
  • 16.4

المصدر

في المثال التالي، يتم تحديد السمة المخصّصة لقبول السمة <color> فقط، وعدم اكتسابها، والحصول على قيمة أولية قيمتها hotpink.

@property --myColor {
  syntax: '<color>';
  inherits: false;
  initial-value: hotpink;
}

أصبحت القاعدة @property الآن جزءًا من "المقياس المرجعي" متاح حديثًا. يمكنك الاطّلاع على مزيد من المعلومات في @property: متغيّرات CSS من الجيل التالي مع دعم المتصفِّحات العامة

يمكن تغيير حجم ArrayBuffer وSharedArrayBuffer قابل للنمو

قابلة لتغيير الحجم ArrayBuffer وقابل للنمو SharedArrayBuffer متاحة الآن في Firefox 128، مما يسمح بتغيير حجم الموارد الاحتياطية دون الحاجة إلى تخصيص المورد الاحتياطي الجديد ونسخ البيانات إليه. تنضم هذه المواقع أيضًا إلى مجموعة Baseline الجديدة.

دعم المتصفح

  • 111
  • 111
  • 128
  • 16.4

المصدر

الكلمة الرئيسية safe في خصائص flexbox

الإصدار 17.6 من Safari هو في الغالب إصدار من إصلاحات للميزات الحالية، ولكنّه يتضمّن أيضًا الكلمة الرئيسية safe لخصائص محاذاة المربّع المرن. وهذا يجعل الكلمة الرئيسية safe قابلة للتشغيل التفاعلي على جميع المتصفّحات.

دعم المتصفح

  • 115
  • 115
  • 63
  • 18

الكلمة الرئيسية safe تمنع المحاذاة المختارة من التسبب في عرض المحتوى خارج مساحة قابلة للعرض. يوضح CodePen التالي كيفية عمله مع عناصر تمت محاذاتها إلى الوسط. إذا تسبّبت محاذاة center في فقدان البيانات عندئذ يتم استخدام start بدلاً من ذلك.

إصدارات المتصفّح التجريبية

تمنحك إصدارات المتصفح التجريبية معاينة للميزات التي ستكون في إصدار ثابت من المتصفح. حان الوقت لاختبار الميزات الجديدة أو عمليات الإزالة، التي قد تؤثر في موقعك قبل أن يحصل العالم على هذا الإصدار. الإصدار الجديد الإصدارات التجريبية هي Firefox 129 الإصدار 128 من Chrome تشير رسالة الأشكال البيانية الإصدار 18 من Safari لا يزال الإصدار التجريبي مستمرًا. توفّر هذه الإصدارات العديد من الميزات الرائعة على المنصة. الاطّلاع على الإصدار ملاحظات للحصول على جميع التفاصيل. إليك بعض الإشعارات المهمة.

يتضمّن Chrome 128 سمة ruby-align في CSS، إلى جانب تغييرات على تجعل فواصل الأسطر ممكنة داخل العناصر التي تحتوي على display: ruby تم أيضًا تعديل السمة zoom لتتطابق مع المواصفات. هناك تعديل على AudioContext API لإضافة طلب معاودة الاتصال تم تعيينه إلى AudiContext.onerror، الذي يُبلغ عن أخطاء في عرض AudioContext أو إنشاءها.

يتضمّن الإصدار 129 من Firefox القاعدة @starting-style وtransition-behavior الموقع. ستصبح هذه المواقع الإلكترونية جزءًا من قائمة "المواقع الإلكترونية الأساسية" التي أصبحت متوفّرة حديثًا مرّة واحدة. تم إطلاق الإصدار 129 من Firefox في إصدار مستقر.