このページは Cloud Translation API によって翻訳されました。

Chrome 126 の新機能

Adriana Jara

必知事項は次のとおりです。

View Transitions API で、ドキュメント間の遷移が新たにサポートされました。
CloseWatcher API が再び利用可能になります。
Gamepad API にトリガーランブルが追加されました。
他にもたくさんあります。

Adriana Jara です。Chrome 126 のデベロッパー向けの新機能を詳しく見ていきましょう。

同一オリジンナビゲーションのドキュメント間のビュー遷移

View Transitions API を使用すると、異なるビュー間でシームレスな視覚的な遷移を作成できます。この API が同一オリジンナビゲーションでデフォルトで使用できるようになりました。これまでは、シングルページアプリケーションアーキテクチャでのみ利用可能でした。

ドキュメント間のビュー移行を実装するには、両端でオプトインする必要があります。そのためには、ビュー遷移アットルールを使用して、ナビゲーション記述子を「自動」に設定します。

ドキュメント間のビュー遷移では、同じドキュメントビュー遷移と同じ構成要素と原則が使用されます。

@view-transition {
  navigation: auto;
}

詳しくは、View Transition API を使用したスムーズな遷移をご覧ください。サンプルの詳細についてはこちらをご覧ください。

CloseWatcher API の再有効化

<dialog> 要素と popover="" 要素の場合、CloseWatcher API を使用すると、デスクトッププラットフォームの ESC キーや Android の「戻る」ジェスチャーなど、閉じるリクエストを簡単に処理できます。

この機能は元々 Chrome 120 で導入されましたが、ダイアログ要素で予期しない操作が行われたため、無効になりました。以前の問題を最小限に抑えるため、改善後に Chrome 126 で再度有効になりました。

CloseWatcher の使用方法については、こちらのデモをご覧ください。

Gamepad API のトリガーランブル拡張機能

トリガーランブル機能が 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 恐竜ゲームをプレイするをご覧ください。

その他

他にもたくさんあります。

GeolocationCoordinates と GeolocationPosition に .toJSON() メソッドが追加されました。
DevTools の更新では、[Application] > [Storage] セクションの専用ツリーでストレージバケットを調べることができます。
ChromeOS で、ウェブアプリのタブモードがサポートされるようになりました。

リリースノートの全文を読む。

Chrome 126 の新機能

同一オリジン ナビゲーションのドキュメント間のビュー遷移

CloseWatcher API の再有効化

Gamepad API のトリガーランブル拡張機能

その他

関連情報

登録

同一オリジンナビゲーションのドキュメント間のビュー遷移