Neu in Chrome 126

Dazu sollten Sie Folgendes wissen:

Mein Name ist Adriana Jara. Jetzt sehen wir uns an, was es bei Chrome 126 Neues für Entwickler gibt.

Dokumentübergreifende Ansichtsübergänge für Navigationen am selben Ursprung

Mit der View Transitions API lassen sich nahtlose visuelle Übergänge zwischen verschiedenen Ansichten erstellen. Sie ist jetzt standardmäßig für Navigationen mit demselben Ursprung verfügbar. Bisher war sie nur für Single-Page-Anwendungsarchitekturen verfügbar.

Um einen dokumentenübergreifenden Ansichtsübergang zu implementieren, müssen beide Seiten zustimmen. Verwenden Sie dazu die At-Regel für den Ansichtsübergang und legen Sie den Navigationsdeskriptor auf „auto“ fest.

Für dokumentenübergreifende Ansichtsübergänge gelten dieselben Bausteine und Prinzipien wie für Übergänge bei der Ansicht desselben Dokuments.

@view-transition {
  navigation: auto;
}

Weitere Informationen und Beispiele finden Sie unter Mit der View Transition API reibungslose Umstellungen vornehmen.

CloseWatcher API wieder aktiviert

Bei den Elementen <dialog> und popover="" erleichtert die CloseWatcher API die Verarbeitung von Schließanfragen, z. B. die Esc-Taste auf Desktop-Plattformen oder die Zurück-Geste unter Android.

Diese Funktion wurde ursprünglich in Chrome 120 bereitgestellt, aber aufgrund einer unerwarteten Interaktion mit dem Dialogelement deaktiviert. Sie wurde in Chrome 126 nach Verbesserungen wieder aktiviert, um die bisherigen Probleme zu minimieren.

Informationen zur Verwendung von CloseWatcher findest du in der entsprechenden Demo.

Gamepad API-Trigger-Rumble-Erweiterung

Die Trigger-Rumble-Funktion ist jetzt Teil der Gamepad API. Sie sorgt für ein noch besseres Gaming-Erlebnis im Web für kompatible Controller.

trigger-rumble ist eine Erweiterung von GamepadHapticActuator. Diese Schnittstelle stellt die Hardware im Controller dar und gibt dem Nutzer (falls verfügbar) haptisches Feedback. Mit trigger-rumble können Webanwendungen, die die Gamepad API verwenden, auch die Trigger dieser Gamepad-Geräte vibrieren.

Mit dem folgenden Code kannst du prüfen, ob die Funktionalität im Browser unterstützt wird und wie du – Wortspiel – auslösen kannsttrigger-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,
  });
};

Weitere Informationen zur optimalen Nutzung der Gamepad API finden Sie unter Chrome Dino mit dem Gamepad spielen.

Und mehr!

Natürlich gibt es noch viel mehr.

Vollständige Versionshinweise

Weitere Informationen

Dies sind nur einige der wichtigsten Punkte. Unter den folgenden Links finden Sie weitere Änderungen in Chrome 126.

Abonnieren

Wenn Sie auf dem Laufenden bleiben möchten, abonnieren Sie den YouTube-Kanal für Chrome-Entwickler. Wir benachrichtigen Sie per E-Mail, wenn wir ein neues Video veröffentlichen.

Hallo Adriana Jara, und sobald Chrome 127 veröffentlicht wird, informiere ich dich über die Neuheiten in Chrome.