Nouveautés de Chrome 72

Pete LePage

Dans Chrome 72, nous avons ajouté la compatibilité avec les éléments suivants:

Et ce n'est pas tout ! Ce n'est pas tout !

Je m'appelle Pete LePage. Voyons ce que Chrome 72 a de nouveau à offrir aux développeurs.

Journal des modifications

Il ne s'agit là que de quelques-uns des points forts. Pour en savoir plus sur les modifications apportées à Chrome 72, consultez les liens ci-dessous.

Champs de classe publics

Mon premier langage était Java, et l'apprentissage de JavaScript m'a un peu perturbé. Comment ai-je créé un cours ? Ou l'héritage ? Qu'en est-il des propriétés et des méthodes publiques et privées ? De nombreuses mises à jour récentes de JavaScript qui facilitent grandement la programmation orientée objet.

Je peux maintenant créer des classes, qui fonctionnent comme prévu, avec des constructeurs, des getters et des setters, des méthodes statiques et des propriétés publiques.

Grâce à la version V8 7.2, fournie avec Chrome 72, vous pouvez désormais déclarer des champs de classe publics directement dans la définition de la classe, ce qui vous évite de le faire dans le constructeur.

class Counter {
  _value = 0;
  get value() {
    return this._value;
  }
  increment() {
    this._value++;
  }
}

const counter = new Counter();
console.log(counter.value);
// → 0
counter.increment();
console.log(counter.value);
// → 1

La prise en charge des champs de classe privés est en cours de développement.

Pour en savoir plus, consultez l'article de Mathias sur les champs de classe.

API User Activation

Vous vous souvenez que le son des sites pouvait être diffusé automatiquement dès le chargement de la page ? Vous essayez de trouver la touche de désactivation du son ou de déterminer quel onglet était concerné, puis de le fermer. C'est pourquoi certaines API nécessitent une activation via un geste de l'utilisateur avant de fonctionner. Malheureusement, les navigateurs gèrent l'activation de différentes manières.

API d'activation des utilisateurs avant et après que l'utilisateur a interagi avec la page.

Chrome 72 introduit la version 2 de l'activation utilisateur, qui simplifie l'activation utilisateur pour toutes les API limitées. Il est basé sur une nouvelle spécification qui vise à normaliser le fonctionnement de l'activation dans tous les navigateurs.

Il existe une nouvelle propriété userActivation sur navigator et MessageEvent, qui comporte deux propriétés: hasBeenActive et isActive:

  • hasBeenActive indique si la fenêtre associée a déjà enregistré une activation utilisateur au cours de son cycle de vie.
  • isActive indique si la fenêtre associée dispose actuellement d'une activation utilisateur dans son cycle de vie.

Pour en savoir plus, consultez Assurer la cohérence de l'activation des utilisateurs entre les API.

Localiser des listes d'éléments avec Intl.format

J'adore les API Intl. Elles sont très utiles pour localiser du contenu dans d'autres langues. Chrome 72 intègre une nouvelle méthode .format() qui facilite l'affichage des listes. Comme les autres API Intl, elle transfère la charge au moteur JavaScript, sans sacrifier les performances.

Initialisez-la avec les paramètres régionaux souhaités, puis appelez format pour que les mots et la syntaxe corrects soient utilisés. Il peut utiliser des conjonctions, ce qui ajoute l'équivalent localisé de and (et regardez ces belles virgules d'Oxford). Il peut effectuer des disjonctions, en ajoutant l'équivalent local de ou. En fournissant des options supplémentaires, vous pouvez faire encore plus.

const opts = {type: 'disjunction'};
const lf = new Intl.ListFormat('fr', opts);
lf.format(['chien', 'chat', 'oiseau']);
// → 'chien, chat ou oiseau'
lf.format(['chien', 'chat', 'oiseau', 'lapin']);
// → 'chien, chat, oiseau ou lapin'

Pour en savoir plus, consultez l'article sur l'API Int.ListFormat.

Et bien plus !

Ce ne sont là que quelques-unes des modifications apportées à Chrome 72 pour les développeurs.

  • Chrome 72 modifie le comportement de Cache.addAll() pour mieux correspondre à la spécification. Auparavant, en cas d'entrées en double dans le même appel, les requêtes ultérieures écrasaient simplement la première. Pour respecter les spécifications, en cas d'entrées en double, la requête est rejetée avec un code InvalidStateError.
  • Les requêtes de favicons sont désormais gérées par le service worker, à condition que l'URL de la requête soit de la même origine que le service worker.

S'abonner

Si vous souhaitez rester informé de nos vidéos, abonnez-vous à notre chaîne YouTube pour les développeurs Chrome. Vous recevrez alors une notification par e-mail chaque fois que nous lancerons une nouvelle vidéo.

Je m'appelle Pete LePage. Dès que Chrome 73 sera disponible, je vous présenterai les nouveautés de Chrome.