جدید در کروم 126

آدریانا خارا

در اینجا چیزی است که شما باید بدانید:

من آدریانا خارا هستم. بیایید وارد آن شویم و ببینیم چه چیزی برای توسعه دهندگان در Chrome 126 جدید است.

انتقال‌های نمای متقابل برای پیمایش‌های با مبدا یکسان

View Transitions API به شما این قدرت را می‌دهد که انتقال‌های بصری یکپارچه بین نماهای مختلف ایجاد کنید و اکنون به‌طور پیش‌فرض برای پیمایش‌های همان مبدا در دسترس است. قبلاً فقط برای معماری های برنامه تک صفحه ای در دسترس بود.

برای اجرای یک انتقال نمای متقابل، هر دو طرف باید شرکت کنند. برای انجام این کار، از view-transition at-rule استفاده کنید و توصیفگر پیمایش را روی auto تنظیم کنید.

انتقال‌های نمای متقاطع از همان بلوک‌های ساختمانی و اصولی استفاده می‌کنند که انتقال‌های نمای سندی یکسان هستند.

@view-transition {
  navigation: auto;
}

برای جزئیات بیشتر، از Transitions Smooth با View Transition API دیدن کنید، نمونه‌ها بیشتر هستند.

CloseWatcher API دوباره فعال شد

برای عناصر <dialog> و popover="" ، CloseWatcher API رسیدگی به درخواست‌های نزدیک را آسان‌تر می‌کند، مانند کلید ESC در پلتفرم‌های دسک‌تاپ یا حرکت برگشتی در Android.

این ویژگی ابتدا در Chrome 120 ارسال شد، اما به دلیل تعامل غیرمنتظره با عنصر گفتگو غیرفعال شد. پس از بهبود در Chrome 126 دوباره فعال شده است تا مشکلات قبلی به حداقل برسد.

برای یادگیری نحوه استفاده از CloseWatcher از نسخه نمایشی آن دیدن کنید.

پسوند Trigger-Rumble API Gamepad

قابلیت trigger-rumble اکنون بخشی از Gamepad API است. این تجربه بازی در وب را برای کنترلرهای سازگار افزایش می دهد.

trigger-rumble GamepadHapticActuator را گسترش می دهد، که رابطی است که نشان دهنده سخت افزار در کنترلر است که برای ارائه بازخورد لمسی به کاربر (در صورت وجود) طراحی شده است. trigger-rumble به برنامه های کاربردی وب که از Gamepad API استفاده می کنند اجازه می دهد تا محرک های آن دستگاه های گیم پد را نیز به لرزه درآورند.

با کد زیر می توانید بررسی کنید که آیا عملکرد در مرورگر پشتیبانی می شود trigger-rumble خیر

// This assumes a `Gamepad` as the value of the `gamepad` variable.
const triggerRumble = (gamepad, delay = 0, duration = 100, weak = 1.0, strong = 1.0) => {
  if (!('vibrationActuator' in gamepad)) {
    return;
  }
  // Feature detection.
  if (!('effects' in gamepad.vibrationActuator) || !gamepad.vibrationActuator.effects.includes('trigger-rumble')) {
    return;
  }
  gamepad.vibrationActuator.playEffect('trigger-rumble', {
    // Duration in ms.
    duration: duration,
    // The left trigger (between 0 and 1).
    leftTrigger: leftTrigger,
    // The right trigger (between 0 and 1).
    rightTrigger: rightTrigger,
  });
};

برای کسب اطلاعات بیشتر برای استفاده حداکثری از Gamepad API، بازی Chrome dino را با گیم پد خود بازی کنید.

و بیشتر!

البته چیزهای بیشتری وجود دارد.

یادداشت های انتشار کامل را بخوانید .

در ادامه مطلب

این فقط برخی از نکات کلیدی را پوشش می دهد. برای تغییرات بیشتر در کروم 126 پیوندهای زیر را بررسی کنید.

مشترک شوید

برای به‌روز ماندن، در کانال YouTube Developers Chrome مشترک شوید و هر زمان که ویدیوی جدیدی را راه‌اندازی کنیم، یک اعلان ایمیلی دریافت خواهید کرد.

Yo soy Adriana Jara، و به محض اینکه Chrome 127 منتشر شد، من اینجا خواهم بود تا به شما بگویم چه چیزهای جدیدی در Chrome وجود دارد!