جدید در Chrome 137، جدید در Chrome 137

راشل اندرو

منتشر شده: ۲۷ مه ۲۰۲۵

کروم ۱۳۷ اکنون در حال انتشار است و این پست برخی از ویژگی‌های کلیدی این نسخه را به اشتراک می‌گذارد. یادداشت‌های کامل انتشار کروم ۱۳۷ را بخوانید.

نکات برجسته این نسخه:

reading-flow و reading-order برای اطمینان از ترتیب منطقی تب‌ها در طرح‌بندی‌های پیچیده استفاده کنید. تابع if() در CSS روشی مختصر برای بیان مقادیر شرطی ارائه می‌دهد. ادغام Promise جاوا اسکریپت (JSPI) به برنامه‌های WebAssembly اجازه می‌دهد تا با promiseهای جاوا اسکریپت ادغام شوند.

reading-flow و reading-order در CSS

ویژگی CSS reading-flow ترتیب نمایش عناصر در طرح‌بندی‌های flex، grid یا block را در معرض ابزارهای دسترسی و نحوه‌ی تمرکز آنها با استفاده از روش‌های ناوبری متوالی خطی را کنترل می‌کند. این ویژگی، مشکل دیرینه‌ی طرح‌بندی‌های grid و flex را حل می‌کند، که در آن ترتیب تب‌ها می‌تواند با ترتیب چیدمان آیتم‌ها متفاوت باشد.

این تابع یک مقدار کلمه کلیدی می‌گیرد که مقدار پیش‌فرض آن normal و رفتار مرتب‌سازی عناصر را به ترتیب DOM حفظ می‌کند. برای استفاده از آن درون یک کانتینر flex، مقدار آن را روی flex-visual یا flex-flow تنظیم کنید. برای استفاده از آن درون یک کانتینر grid، مقدار آن را روی grid-rows ، grid-columns یا grid-order تنظیم کنید.

ویژگی reading-order در CSS به شما امکان می‌دهد تا به صورت دستی ترتیب آیتم‌ها را در یک محفظه جریان خواندن تغییر دهید. برای استفاده از این ویژگی در یک محفظه grid، flex یا block، مقدار reading-flow را در محفظه روی source-order تنظیم کنید و reading-order هر آیتم را روی یک مقدار صحیح تنظیم کنید.

برای کسب اطلاعات بیشتر، مقاله «استفاده reading-flow CSS برای ناوبری فوکوس ترتیبی منطقی» را مطالعه کنید.

تابع if() در CSS

تابع if() در CSS روشی مختصر برای بیان مقادیر شرطی ارائه می‌دهد. این تابع مجموعه‌ای از جفت‌های شرط-مقدار را می‌پذیرد که با نقطه ویرگول از هم جدا شده‌اند. این تابع هر شرط را به ترتیب ارزیابی می‌کند و مقدار مرتبط با اولین شرط درست را برمی‌گرداند. اگر هیچ یک از شرط‌ها درست ارزیابی نشوند، تابع یک جریان توکن خالی را برمی‌گرداند.

div {
  color: var(--color);
  background-color: if(style(--color: white): black; else: white);
}

.dark {
  --color: black;
}

.light {
  --color: white;
}

<div class="dark">dark</div>
<div class="light">light</div>

ادغام وعده‌های جاوا اسکریپت WebAssembly (JSPI)

ادغام وعده‌های جاوا اسکریپت (JSPI) یک API است که به برنامه‌های WebAssembly اجازه می‌دهد تا با وعده‌های جاوا اسکریپت ادغام شوند.

این به یک برنامه WebAssembly اجازه می‌دهد تا به عنوان تولیدکننده یک promise عمل کند، و به برنامه WebAssembly اجازه می‌دهد تا با API های حامل promise تعامل داشته باشد.

به طور خاص، وقتی یک برنامه از JSPI برای فراخوانی یک API حامل وعده (جاوااسکریپت) استفاده می‌کند، کد WebAssembly به حالت تعلیق در می‌آید؛ و به فراخواننده اصلی برنامه WebAssembly وعده‌ای داده می‌شود که با تکمیل نهایی برنامه WebAssembly، محقق خواهد شد.

و بیشتر!

البته موارد بسیار بیشتری وجود دارد:

  • به عنوان ادامه‌ی پارتیشن‌بندی ذخیره‌سازی، کروم پارتیشن‌بندی دسترسی به Blob URL را بر اساس کلید ذخیره‌سازی پیاده‌سازی کرده است.
  • قالب‌های پیکسلی ممیز شناور Canvas اکنون پیاده‌سازی شده‌اند.
  • offset-path: shape() پشتیبانی می‌شود، بنابراین می‌توانید از شکل‌های واکنش‌گرا برای تنظیم مسیر انیمیشن استفاده کنید.

مطالعه بیشتر

این فقط برخی از نکات برجسته کلیدی را پوشش می‌دهد. برای تغییرات بیشتر در کروم ۱۳۷، لینک‌های زیر را بررسی کنید.

اشتراک

برای به‌روز ماندن، در کانال یوتیوب توسعه‌دهندگان کروم مشترک شوید و هر زمان که ویدیوی جدیدی منتشر کنیم، یک اعلان ایمیلی دریافت خواهید کرد. یا برای مقالات و پست‌های وبلاگ جدید، ما را در X یا لینکدین دنبال کنید.

به محض انتشار کروم ۱۳۸، ما همینجا هستیم تا به شما بگوییم چه چیزهایی در کروم جدید است!