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

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

Rachel Andrew

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

در می 2023، فایرفاکس 113 ، کروم 113 ، کروم 114 و سافاری 16.5 پایدار شدند. بیایید نگاهی بیندازیم که این به چه معناست برای پلتفرم وب.

WebGPU

Chrome 113 شامل WebGPU ، جانشین APIهای گرافیکی WebGL و WebGL 2 برای وب است. این ویژگی‌های مدرن مانند محاسبات GPU، دسترسی سربار کمتر به سخت‌افزار GPU، توانایی رندر کردن چندین بوم از یک دستگاه گرافیکی، و عملکرد بهتر و قابل پیش‌بینی‌تر را ارائه می‌کند.

مجموعه های شخص اول

مجموعه‌های شخص اول (FPS) بخشی از جعبه ایمنی حریم خصوصی است. این روشی است برای سازمان ها برای اعلام روابط بین سایت ها، به طوری که مرورگرها می توانند تصمیم بگیرند که چه زمانی اجازه دسترسی محدود به کوکی های شخص ثالث را برای سایت های موجود در یک مجموعه بدهند. FPS عرضه مرحله‌ای را در Chrome 113 آغاز کرد.

ویژگی های رسانه CSS و موارد دیگر

برای CSS، Chrome 113 شامل ویژگی‌های رسانه‌ای overflow-inline و overflow-block است.

و ویژگی update رسانه.

همچنین تابع easing linear() نیز گنجانده شده است که می توانید در مقاله ایجاد منحنی های انیمیشن پیچیده در CSS با تابع easing linear() در مورد آن اطلاعات بیشتری کسب کنید.

ویژگی های CSS Color Level 4

فایرفاکس 113 شامل نمادهای تابعی color() ، lab() ، lch() ، oklab() ، oklch() و color-mix() به همراه ویژگی اجباری-color-adjust است. این بدان معناست که فضاهای رنگی و عملکردهای جدید اکنون در هر سه موتور اصلی پشتیبانی می شوند. می‌توانید در راهنمای رنگ‌های CSS با وضوح بالا درباره این فضاهای رنگی و عملکردها بیشتر بدانید.

کنترل بیشتر بر انتخاب های :nth-child()

فایرفاکس 113 همچنین قابلیت ارسال یک لیست انتخابگر را به :nth-child() و nth-last-child() اضافه می کند. در مورد این بیشتر بیاموزید و نمونه هایی را در پست مشاهده کنید. کنترل بیشتر بر انتخاب های :nth-child() با دستور S

Compression Streams API

اکنون به دلیل گنجاندن در فایرفاکس 113 در هر سه موتور اصلی پشتیبانی می شود، فشرده سازی جریان ها API فشرده سازی و رفع فشرده سازی جریان ها را امکان پذیر می کند. این بدان معنی است که برنامه های جاوا اسکریپت دیگر نیازی به بسته بندی یک کتابخانه فشرده سازی ندارند.

تودرتو CSS

Safari 16.5 اکثراً مشکلات را حل می‌کند، اما پشتیبانی از CSS Nesting را نیز اضافه می‌کند، با انتخابگر تودرتوی جدید > ، که برای تودرتو کردن قوانین سبک مرتبط استفاده می‌شود، به گونه‌ای که برای توسعه‌دهندگانی که از پیش پردازنده‌ها استفاده کرده‌اند آشنا خواهد بود:

.nesting {
  color: hotpink;

  > .is {
    color: rebeccapurple;

    > .awesome {
      color: deeppink;
    }
  }
}

متعادل کردن سرفصل ها با text-wrap: balance

از Chrome 114 می‌توانید از text-wrap: balance استفاده کنید. این به شما امکان می‌دهد تا سرفصل‌ها را متعادل کنید، از داشتن یک کلمه در سطر پایانی اجتناب کنید و نتیجه دلپذیرتر و خواندنی‌تری ارائه کنید. می‌توانید در CSS text-wrap: balance اطلاعات بیشتری کسب کنید.

تراشه ها: کوکی هایی که حالت تقسیم شده مستقل دارند

به عنوان بخشی از کار برای حذف تدریجی کوکی‌های شخص ثالث ، CHIPS امکان انتخاب کوکی‌های شخص ثالث را فراهم می‌کند که توسط سایت سطح بالا با استفاده از ویژگی کوکی جدید Partitioned پارتیشن بندی می‌شوند. CHIPS در کروم 114 موجود است.

Popover API

همچنین در Chrome 114، Popover API وجود دارد که ساختن عناصر رابط کاربری گذرا (UI) را آسان‌تر می‌کند که در بالای همه رابط‌های کاربری دیگر برنامه‌های وب نمایش داده می‌شوند.

این موارد شامل عناصر تعاملی کاربر مانند منوهای عمل، پیشنهادات عناصر فرم، انتخاب‌کننده محتوا و رابط کاربری آموزشی است.

ویژگی popover جدید هر عنصری را قادر می سازد تا به طور خودکار در لایه بالایی نمایش داده شود. این بدان معناست که دیگر نگران موقعیت‌یابی، چیدمان عناصر، فوکوس یا تعاملات صفحه کلید برای توسعه‌دهنده نباشید.

در معرفی popover API بیشتر بیاموزید.

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

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

Chrome 115 شامل چندین مقدار برای ویژگی display CSS است. این بدان معنی است که display: flex به display: block flex و display: block به display: block flow . مقادیر منفرد به عنوان کلمات کلیدی قدیمی حفظ می‌شوند، و یک بار در Chrome Stable، چندین مقدار در همه موتورها در دسترس هستند.

همچنین در Chrome 115 افزونه های ScrollTimeline و ViewTimeline به مشخصات Web Animations وجود دارد. اینها انیمیشن های اسکرول را از طریق CSS و جاوا اسکریپت فعال می کنند.

فایرفاکس 114 شامل WebTransport API است، یک به‌روزرسانی مدرن برای WebSockets که از جریان‌های چندگانه، جریان‌های یک طرفه، و تحویل خارج از سفارش پشتیبانی می‌کند.

بخشی از سری جدید به وب