در ماه مه وارد پلتفرم وب شده است

برخی از ویژگی های جالبی را که در ماه می 2024 در مرورگرهای وب پایدار و بتا مشاهده می شود، کشف کنید.

Rachel Andrew

نسخه های مرورگر پایدار

در می 2024 فایرفاکس 126 ، سافاری 17.5 و کروم 125 پایدار شدند. این پست به ویژگی های جدید اضافه شده به پلتفرم وب می پردازد.

موقعیت یابی لنگر CSS

کروم 125 شامل موقعیت یابی لنگر CSS است. این به شما امکان می‌دهد یک عنصر کاملاً موقعیت‌یافته را بدون استفاده از جاوا اسکریپت به یک یا چند عنصر دیگر در صفحه (لنگرها) به روشی اعلانی متصل کنید. زمانی که لنگرها قابل پیمایش هستند، موقعیت لنگر به خوبی کار می کند. یک مورد معمول استفاده، قرار دادن پاپاور مانند یک راهنمای ابزار در کنار عنصری است که آن را فراخوانی کرده است، یا یک منوی انتخابی و لیست گزینه های پاپاور آن.

در معرفی API موقعیت یابی لنگر CSS بیشتر بیاموزید.

توابع ارزش پله ای CSS- round() ، mod() و rem()

Chrome 125 همچنین شامل توابع مقدار پله ای است، به این معنی که این توابع اکنون به تازگی در دسترس هستند. توابع مقدار steppped، round() ، mod() و rem() همگی یک مقدار داده شده را مطابق با "مقدار مرحله" دیگری تبدیل می کنند.

توابع ریاضی ارزش پله‌ای CSS اکنون در Baseline 2024 هستند .

تابع light-dark()

همچنین به Baseline Newly Available تابع رنگ CSS light-dark() است که در Safari 17.5 است.

light-dark() تابعی است که دو آرگومان را می پذیرد که هر دو باید یک <color> باشند. یکی از هر دو بسته به طرح رنگ مورد استفاده انتخاب می شود.

• اگر طرح رنگ استفاده شده light یا ناشناخته باشد، مقدار محاسبه شده اولین مقدار برگردانده می شود.
• اگر طرح رنگ استفاده شده dark باشد، مقدار محاسبه شده رنگ دوم برگردانده می شود.

در رنگ‌های وابسته به طرح رنگ CSS با () light-dark بیشتر بخوانید.

Screen Wake Lock API

فرود در فایرفاکس 126 Screen Wake Lock API است، ویژگی دیگری که اکنون بخشی از Baseline Newly Available است. این API راهی برای جلوگیری از کم نور شدن دستگاه و قفل شدن صفحه نمایش فراهم می کند.

با نحوه استفاده از این ویژگی در Stay awake با Screen Wake Lock API آشنا شوید.

Compute Pressure API

Compute Pressure API حالت های سطح بالایی را ارائه می دهد که نشان دهنده بار CPU در سیستم است. این به پیاده‌سازی اجازه می‌دهد تا از معیارهای سخت‌افزاری زیربنایی درست استفاده کند تا اطمینان حاصل شود که کاربران می‌توانند تا زمانی که سیستم تحت فشار غیرقابل مدیریتی قرار نگیرد، از تمام قدرت پردازشی در دسترس خود استفاده کنند.

این ویژگی در کروم 125 است. اینتل کار طراحی و پیاده‌سازی این API را رهبری کرد که به برنامه‌های کنفرانس ویدیویی اجازه می‌دهد تا ویژگی‌ها و عملکرد را به طور پویا متعادل کنند.

مستندات The Compute Pressure API را بخوانید.

قانون @starting-style

Safari 17.5 شامل قانون @starting-style است. این قانون CSS به شما امکان می دهد سبکی را اعمال کنید که مرورگر می تواند قبل از باز شدن عنصر در صفحه، در صورت نیاز برای انیمیشن های ورودی، آن را جستجو کند.

قانون @starting-style یکی از ویژگی‌هایی است که در چهار ویژگی جدید CSS برای ورود و خروج روان انیمیشن‌ها پوشش داده شده است.

مرورگر بتا منتشر شد

نسخه های مرورگر بتا پیش نمایشی از مواردی را که در نسخه پایدار بعدی مرورگر وجود خواهند داشت، به شما ارائه می دهند. زمان بسیار خوبی برای آزمایش ویژگی‌های جدید یا حذف‌هایی است که می‌تواند بر سایت شما تأثیر بگذارد، قبل از اینکه جهان آن نسخه را دریافت کند. نسخه های بتا جدید فایرفاکس 127 و کروم 126 هستند. این نسخه ها ویژگی های بسیار خوبی را برای پلتفرم به ارمغان می آورند. برای همه جزئیات، یادداشت های انتشار را بررسی کنید. در اینجا فقط چند نکته برجسته وجود دارد.

Chrome 126 شامل انتقال‌های نمای متقابل اسناد برای پیمایش‌های مبدا یکسان است. قبلاً برای استفاده از View Transitions API مجبور بودید وب سایت خود را مجدداً در یک SPA معماری کنید. موضوع دیگه این نیست. اکنون انتقال‌های مشاهده به‌طور پیش‌فرض برای پیمایش‌های با مبدا یکسان فعال هستند. می‌توانید بین دو سند مختلف که منشأ یکسانی دارند، یک تغییر نمای ایجاد کنید.

فایرفاکس 127 شامل متدهای اضافی مجموعه جاوا اسکریپت می شود intersection() , union() , difference() , symmetricDifference() , isSubsetOf() , isSupersetOf() و isDisjointFrom() .