خلاصه ماهانه ژانویه ۲۰۲۶ (مقدمه‌ای)

منتشر شده: ۲ مارس ۲۰۲۶

به نسخه ژانویه ۲۰۲۶ از خلاصه Baseline خوش آمدید. هر ماه، ما ویژگی‌های پلتفرم وب را که در Baseline به نقاط عطف جدیدی رسیده‌اند، برجسته می‌کنیم و به شما کمک می‌کنیم تا بفهمید چه ابزارهایی امروز برای استفاده در پروژه‌های شما آماده هستند.

ژانویه شروع هیجان‌انگیزی برای سال بود، چرا که چندین API و واحد CSS مهم به دسته‌ی «جدیداً در دسترس» اضافه شدند و یک بهبود عمده در طرح‌بندی به طور گسترده در دسترس قرار گرفت.

ویژگی‌های جدید موجود

ویژگی‌های وب زیر در ژانویه ۲۰۲۶ به نسخه پایه (Baseline New) اضافه شدند.

انتقال نمای فعال

شبه کلاس CSS :active-view-transition اکنون به صورت Baseline و به تازگی در دسترس قرار گرفته است. این انتخابگر به توسعه‌دهندگان اجازه می‌دهد تا عنصر ریشه یک سند را به طور خاص در حالی که یک گذار نما در حال انجام است، هدف قرار داده و سبک‌دهی کنند. این امر به ویژه برای اعمال سبک‌های سراسری یا تنظیماتی که فقط باید در طول دوره گذار وجود داشته باشند، مانند تغییر رنگ پس‌زمینه پوشش گذار یا تنظیم z-index لایه‌های خاص برای اطمینان از جریان بصری روان، مفید است.

ماژول‌های جاوا اسکریپت در سرویس ورکرها

سرویس ورکرها اکنون از ماژول‌های جاوا اسکریپت در تمام موتورهای مرورگر اصلی پشتیبانی می‌کنند . با تنظیم گزینه type: 'module' هنگام فراخوانی navigator.serviceWorker.register() ، می‌توانید از دستورات استاندارد import و export در اسکریپت سرویس ورک خود استفاده کنید. این امر، سرویس ورکرها را با شیوه‌های مدرن توسعه جاوا اسکریپت هماهنگ می‌کند و امکان سازماندهی بهتر کد، مدیریت آسان‌تر وابستگی‌ها و امکان اشتراک‌گذاری کد بین نخ اصلی و ورک پس‌زمینه را فراهم می‌کند.

API ناوبری (Navigation API) یک جایگزین مدرن و هدفمند برای API قدیمی History ارائه می‌دهد که به‌طور خاص برای نیازهای برنامه‌های تک‌صفحه‌ای (SPA) طراحی شده است. این API یک روش متمرکز برای شروع، رهگیری و مدیریت انواع اقدامات ناوبری، از جمله مواردی که توسط دکمه‌های عقب و جلو مرورگر ایجاد می‌شوند، ارائه می‌دهد. با رویدادهایی مانند Maps ، توسعه‌دهندگان می‌توانند مسیریابی سمت کلاینت روان‌تری را با کد تکراری کمتر پیاده‌سازی کنند. برای بررسی عمیق‌تر چگونگی تغییر نحوه ساخت وب توسط این API، به پست وبلاگ اختصاصی ما مراجعه کنید: مسیریابی سمت کلاینت مدرن: API ناوبری .

واحد CSS rcap

واحد rcap یک واحد طول نسبی فونت ریشه است که برابر با "ارتفاع حروف بزرگ" (ارتفاع اسمی حروف بزرگ) فونت عنصر ریشه است. این امر امکان طرح‌بندی‌های تایپوگرافی دقیقی را فراهم می‌کند که نسبت به فونت اصلی مورد استفاده در سایت، به جای فقط اندازه فونت، مقیاس‌بندی می‌شوند.

واحد CSS rch سی اس اس

مشابه واحد ch اما نسبت به عنصر ریشه، واحد rch نشان دهنده عرض - یا به طور خاص تر، اندازه پیشروی - گلیف "0" (صفر) در فونت عنصر ریشه است. این واحد برای ایجاد طرح بندی هایی که به عرض کاراکتر بستگی دارند، مانند ظرفی که باید دقیقاً تعداد مشخصی از کاراکترها را در فونت ریشه جای دهد، ایده آل است.

واحد CSS rex

واحد rex نسخه نسبی ریشه ex است که برابر با ارتفاع x فونت عنصر ریشه است. این واحد به ویژه برای ترازبندی عمودی و اندازه‌بندی عناصر نسبت به ارتفاع حروف کوچک در تایپوگرافی اصلی سند شما مفید است.

واحد CSS ric

واحد ric معادل نسبی ریشه برای واحد ic است. این واحد برابر با معیار پیشرفته "ایدئوگرافیک" (معمولاً عرض یا ارتفاع یک ایدئوگراف CJK) فونت عنصر ریشه است. این یک ابزار حیاتی برای توسعه‌دهندگانی است که طرح‌بندی‌های بین‌المللی می‌سازند، به‌ویژه آنهایی که از اسکریپت‌های چینی، ژاپنی یا کره‌ای استفاده می‌کنند.

ویژگی‌های پایه و گسترده

ویژگی‌های وب زیر در ژانویه ۲۰۲۶ به صورت گسترده در دسترس قرار گرفتند.

ویژگی display دو مقداری CSS

سینتکس چند کلمه کلیدی برای ویژگی display اکنون به صورت Baseline Widely در دسترس است. این به‌روزرسانی به شما امکان می‌دهد تا به طور صریح هر دو نوع نمایش "بیرونی" و "درونی" یک کادر را تعریف کنید. برای مثال، به جای inline-flex از پیش تعیین‌شده، می‌توانید display: inline flex استفاده کنید. این مشخص می‌کند که آیا یک عنصر در جریان بلوکی یا درون‌خطی (نوع بیرونی) شرکت می‌کند و نحوه چیدمان فرزندان آن (نوع درونی، مانند flex یا grid ) چگونه است. این تغییر، موتور طرح‌بندی CSS را برای توسعه‌دهندگان منطقی‌تر و سازگارتر می‌کند.

ویژگی animation-composition در CSS

ویژگی animation-composition نحوه تعامل چندین انیمیشن را هنگامی که به طور همزمان بر یک ویژگی تأثیر می‌گذارند، تعریف می‌کند. شما می‌توانید بین replace ، add یا accumulate یکی را انتخاب کنید که به شما کنترل دقیقی بر نحوه محاسبه انیمیشن‌های پیچیده و لایه‌ای می‌دهد.

آرایه بر اساس کپی

جاوا اسکریپت اکنون شامل متدهایی است که به شما امکان می‌دهند آرایه‌ها را بدون تغییر داده‌های اصلی تبدیل کنید . متدهایی مانند toReversed() ، toSorted() و toSpliced() یک کپی جدید و اصلاح‌شده از آرایه را برمی‌گردانند و سبک برنامه‌نویسی کاربردی‌تر و ایمن‌تری را ترویج می‌دهند.

به ما در بهبود کمک کنید

طبق معمول، اگر نکته‌ای مربوط به Baseline را از قلم انداخته‌ایم، به ما اطلاع دهید و مطمئن می‌شویم که در نسخه‌های بعدی به آن پرداخته شود! اگر سؤالی دارید یا می‌خواهید در مورد Baseline بازخوردی ارائه دهید، می‌توانید مشکل خود را در بخش پیگیری مشکلات ما ثبت کنید.