الجمعة, سبتمبر 25


تاريخ النشر: 14 أبريل 2026

لقد كان شهرًا مزدحمًا لمنصة الويب! في مارس 2026، تجاوزت العديد من الميزات القوية عتبة إمكانية التشغيل البيني لتصبح متاحة حديثًا في Baseline، في حين وصلت موجة هائلة من الأدوات القائمة إلى مرحلة التوفر على نطاق واسع.

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

الميزات الأساسية المتوفرة حديثًا

أصبحت الميزات التالية قابلة للتشغيل المتبادل عبر جميع محركات المتصفح الأساسية في مارس 2026.

عائلة الخطوط الرياضيات

ال math قيمة ل font-family تم تصميم الخاصية خصيصًا لتقديم المحتوى الرياضي. فهو يضمن عرض عناصر MathML باستخدام خطوط محسنة للصيغ الرياضية المعقدة، مما يوفر تباعدًا أفضل ودعمًا للأحرف للمستندات الفنية. تعرف على المزيد حول عائلة خطوط الرياضيات على MDN

Iterator.concat()

تتيح هذه الطريقة الثابتة الجديدة للمكررات للمطورين دمج عدة تكرارات (مثل المصفوفات أو المجموعات أو التكرارات المخصصة) في مكرر واحد. يعمل هذا على تبسيط التعليمات البرمجية التي تحتاج إلى معالجة تسلسلات البيانات على التوالي دون تداخل الحلقات يدويًا أو إنشاء صفائف وسيطة. تعلم المزيد عن Iterator.concat() على MDN

تدفقات بايت قابلة للقراءة

تتضمن Streams API الآن الدعم الكامل لتدفقات البايت القابلة للقراءة. تم تحسينها للتعامل مع البيانات الثنائية، مما يسمح بإدارة الذاكرة بكفاءة من خلال قراءة البيانات مباشرة في المخازن المؤقتة التي يوفرها المطور. يعد هذا بمثابة تغيير في قواعد اللعبة بالنسبة للتطبيقات ذات الأداء الحيوي التي تتعامل مع الملفات الكبيرة أو بيانات الشبكة. تعرف على المزيد حول تدفقات البايت القابلة للقراءة على MDN

واجهة برمجة التطبيقات لإعداد التقارير

توفر Reporting API آلية إعداد تقارير عامة لتطبيقات الويب لتلقي إشعارات حول الأخطاء والانتهاكات على مستوى المتصفح، مثل انتهاكات سياسة أمان المحتوى (CSP)، وعمليات الإيقاف، وتقارير الأعطال. فهو يقوم بمركزية هذه التقارير وإرسالها إلى نقطة نهاية محددة لتسهيل المراقبة. تعرف على المزيد حول Reporting API على MDN

WebTransport

WebTransport عبارة عن واجهة برمجة تطبيقات حديثة توفر اتصالاً ثنائي الاتجاه بين العميل والخادم بزمن وصول منخفض. تم تصميمه استنادًا إلى HTTP/3، وهو يدعم كلاً من نقل البيانات الموثوق به ومخططات البيانات غير الموثوقة، مما يجعله مثاليًا للتطبيقات في الوقت الفعلي مثل الألعاب والبث المباشر. تعرف على المزيد حول WebTransport على MDN

text-indent: each-line تصريح

ال each-line الكلمة الرئيسية ل text-indent يمتد المسافة البادئة إلى ما هو أبعد من السطر الأول من الكتلة. عند استخدامه، فإنه يضع مسافة بادئة للسطر الأول بالإضافة إلى أي سطر يتبع فاصل سطر ثابت (مثل <br>)، مما يوفر تحكمًا أكثر تفصيلاً في التخطيطات المطبعية. تعلم المزيد عن text-indent: each-line على MDN

text-indent: hanging تصريح

ال hanging الكلمة الأساسية تعكس سلوك المسافة البادئة الافتراضية. إنه يترك السطر الأول من الكتلة في بداية السطر مع وضع مسافة بادئة لجميع الأسطر اللاحقة. وهذا مطلب شائع للببليوغرافيات وأساليب التحرير المحددة. تعلم المزيد عن text-indent: hanging على MDN

الميزات المتوفرة على نطاق واسع

في مارس 2026، انتقلت هذه الميزات إلى الطبقة المتاحة على نطاق واسع، مما يعني أنها كانت قابلة للتشغيل البيني لمدة 30 شهرًا وهي آمنة للاستخدام في معظم بيئات الإنتاج بدون عمليات تعبئة متعددة.

contain-intrinsic-size خاصية CSS

جزء من وحدة احتواء CSS، contain-intrinsic-size يسمح للمطورين بتحديد حجم العنصر النائب للعناصر الخاضعة لاحتواء الحجم. وهذا يمنع تغييرات التخطيط عندما يتم تحميل المحتوى أو إخفاؤه بتكاسل. تعلم المزيد عن contain-intrinsic-size على MDN

@counter-style في القاعدة

ال @counter-style تسمح القاعدة للمطورين بتحديد أنماط الترقيم أو التعداد النقطي المخصصة للقوائم. وهذا يتجاوز الأنماط العشرية أو القرصية القياسية، مما يسمح بعلامات قائمة معقدة أو محلية أو مزخرفة بحتة. تعلم المزيد عن @counter-style على MDN

أحداث توجيه الجهاز

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

hyphenate-character خاصية CSS

تتيح لك هذه الخاصية تحديد الحرف المستخدم في نهاية السطر عند إضافة الواصلة إلى الكلمة. على الرغم من أن الواصلة القياسية هي الإعداد الافتراضي، إلا أن هذه الخاصية توفر المرونة اللازمة لاستخدام أحرف أخرى لتصميم محدد أو متطلبات لغة. تعرف على المزيد حول حرف الواصلة على MDN

hyphens خاصية CSS

ال hyphens تتحكم الخاصية في كيفية تعامل المتصفح مع الواصلة عند التفاف النص. يمكنك ضبطه على none, manual (باستخدام الواصلات الناعمة)، أو auto (السماح للمتصفح باستخدام قاموس الواصلة الخاص به). تعرف على المزيد حول hyphens خاصية CSS على MDN

image-set() وظيفة CSS

ال image-set() تتيح الوظيفة لـ CSS تقديم الصورة الأكثر ملاءمة بناءً على إمكانيات جهاز المستخدم، مثل دقة الشاشة. وهو يعمل بشكل مشابه ل srcset سمة ل <img> العلامات، مما يضمن صورًا عالية الجودة دون إضاعة النطاق الترددي. تعرف على المزيد حول image-set() وظيفة CSS على MDN

تسمح علاقة الارتباط هذه للمطورين بإخبار المتصفح بإحضار وحدات JavaScript ومعالجتها (وتوابعها) في وقت مبكر من عملية تحميل الصفحة. وهذا يقلل من الوقت المستغرق في المسار الحرج ويحسن أداء التطبيقات ذات الوحدات الثقيلة. تعلم المزيد عن <link rel="modulepreload"> على MDN

تجاوز استعلامات الوسائط

ال overflow-block و overflow-inline تتيح لك ميزات الوسائط الاستعلام عن كيفية تعامل الجهاز مع المحتوى الذي يتجاوز إطار العرض الأولي. يعد هذا مفيدًا بشكل خاص لتخصيص الأنماط لأنواع مختلفة من أجهزة العرض، مثل الوسائط المقسمة إلى صفحات (الطابعات) مقابل شاشات التمرير المستمرة. تعرف على المزيد حول استعلامات الوسائط الفائضة على MDN

توفر واجهة برمجة تطبيقات التخزين طريقة لإدارة استمرارية التخزين والحصة النسبية لموقع الويب والاستعلام عنها. فهو يسمح للمطورين بالتحقق من مقدار المساحة المتوفرة ومطالبة المتصفح بالاحتفاظ بالبيانات باستمرار بدلاً من مسحها عندما تكون مساحة التخزين منخفضة. تعلم المزيد عن navigator.storage على MDN

update استعلام الوسائط

ال update تتيح لك ميزة الوسائط اكتشاف مدى قدرة جهاز الإخراج على تعديل مظهر المحتوى. ويساعد ذلك في التمييز بين الشاشات سريعة التحديث (مثل الهواتف الذكية) والشاشات بطيئة التحديث أو الثابتة (مثل قارئات الحبر الإلكتروني). تعرف على المزيد حول update استعلام الوسائط على MDN

الشبكة الفرعية CSS

تعد شبكة CSS الفرعية امتدادًا قويًا لشبكة CSS التي تسمح للشبكة المتداخلة بوراثة تعريفات المسار (الأعمدة والصفوف) لشبكتها الأصلية. وهذا يجعل من السهل جدًا محاذاة العناصر عبر مستويات مختلفة من شجرة DOM، مما يحل تحدي التخطيط طويل الأمد. تعرف على المزيد حول شبكة CSS الفرعية على MDN

راشيل أندرو تذهب إلى Web Day Out

في الشهر الماضي، كتبت راشيل أندرو، من Chrome، انظر إلى مستقبل منصة الويب، والتي ذكرت محاضرة ألقتها في Web Day Out. غطى العرض التقديمي دعم المتصفح، وليس فقط الأهداف الأساسية، ولكن كيف يمكنك أن تقرر استخدام الميزات التي لا تلبي هدفك الأساسي.

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

يعد اختيار هدف أساسي بشكل عملي أمرًا جيدًا للحديث عنه – ونحن نوصي بالتأكيد بمراجعة رأي راشيل بشأنه). عندما تفكر في الأهداف الأساسية كنقاط زمنية – بدلاً من متصفحات محددة – تساعدك هذه العقلية على اتخاذ قرارات ليست “آمنة” فقط في يومنا هذا، ولكنها قرارات أكثر تقدمًا في التفكير بشأن الميزات الناشئة القابلة للتشغيل البيني مع الحفاظ على مستوى عالٍ من التوافق.

إضافة حالة خط الأساس إلى موقع أحد عشر

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

بالطبع، لا يقتصر مكون ويب الحالة الأساسية على Eleventy، فهو مكون ويب مفتوح المصدر ومستقل عن أي إطار عمل أو منشئ موقع.

تعليق

إذا كانت هناك ميزة تنتظرها غير موجودة في Baseline، أو إذا وجدت مشكلة في إحدى الميزات المدرجة هنا، فأخبرنا بذلك من خلال أداة التتبع الخاصة بنا. تساعدنا ملاحظاتك في تحديد أولويات العمل الأكثر أهمية بالنسبة لك.

شاركها.
اترك تعليقاً