Nieuw in Chrome 126

Dit is wat u moet weten:

Ik ben Adriana Jara. Laten we erin duiken en kijken wat er nieuw is voor ontwikkelaars in Chrome 126.

Weergaveovergangen tussen documenten voor navigatie met dezelfde oorsprong

De View Transitions API geeft u de mogelijkheid om naadloze visuele overgangen tussen verschillende weergaven te creëren en is nu standaard beschikbaar voor navigatie met dezelfde oorsprong. Voorheen was het alleen beschikbaar voor applicatie-architecturen met één pagina.

Om een ​​overgang tussen documentweergaven te implementeren, moeten beide kanten zich aanmelden. Om dit te doen, gebruikt u de at-regel voor weergaveovergang en stelt u de navigatiedescriptor in op automatisch.

Overgangen tussen weergaven tussen documenten gebruiken dezelfde bouwstenen en principes als overgangen tussen weergaven binnen dezelfde documenten.

@view-transition {
  navigation: auto;
}

Bezoek Smooth transitions with the View Transition API voor details, voorbeelden zijn meer.

CloseWatcher API opnieuw ingeschakeld

Voor <dialog> en popover="" elementen maakt de CloseWatcher API het gemakkelijker om sluitverzoeken af ​​te handelen, zoals de ESC-toets op desktopplatforms of het teruggebaar op Android.

Deze functie werd oorspronkelijk geleverd in Chrome 120 , maar werd uitgeschakeld vanwege een onverwachte interactie met het dialoogelement. Het is opnieuw ingeschakeld in Chrome 126 na verbeteringen om de eerdere problemen te minimaliseren.

Bezoek de demo om te leren hoe u CloseWatcher kunt gebruiken.

Gamepad API trigger-rumble-extensie

De trigger-rumble-mogelijkheid maakt nu deel uit van de Gamepad API . Het verbetert de game-ervaringen op internet voor compatibele controllers.

trigger-rumble breidt de GamepadHapticActuator uit, een interface die hardware in de controller vertegenwoordigt die is ontworpen om haptische feedback aan de gebruiker te geven (indien beschikbaar). trigger-rumble kunnen webapplicaties die de Gamepad API gebruiken ook de triggers van die gamepad-apparaten laten trillen.

Met de volgende code kun je controleren of de functionaliteit in de browser wordt ondersteund en hoe je kunt triggeren – woordspeling bedoeld – 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,
  });
};

Bekijk Speel het Chrome-dinospel met je gamepad voor meer informatie om het meeste uit de Gamepad API te halen.

En meer!

Natuurlijk is er nog veel meer.

Lees de volledige releaseopmerkingen .

Verder lezen

Dit behandelt slechts enkele belangrijke hoogtepunten. Controleer de volgende links voor aanvullende wijzigingen in Chrome 126.

Abonneren

Als u op de hoogte wilt blijven, abonneert u zich op het YouTube-kanaal van Chrome Developers . U ontvangt dan een e-mailmelding wanneer we een nieuwe video lanceren.

Yo soy Adriana Jara, en zodra Chrome 127 uitkomt, ben ik hier om je te vertellen wat er nieuw is in Chrome!