- Chrome 62 rend l'API Network Information plus utile en fournissant des métriques de performances réelles au lieu de résultats théoriques.
- Les polices variables OpenType sont désormais disponibles.
- Vous pouvez capturer des flux multimédias à partir d'éléments HTML Media.
- Je vous rappelle un changement important qui sera appliqué dans Chrome 62.
Et ce n'est pas tout ! En savoir plus
Je m'appelle Pete LePage. Voyons ce que Chrome 62 a de nouveau à offrir aux développeurs.
Vous souhaitez consulter la liste complète des modifications ? Consultez la liste des modifications apportées au dépôt source Chromium.
Indicateur de qualité du réseau
L'API Network Information est disponible dans Chrome depuis un certain temps, mais elle ne fournit que des vitesses réseau théoriques en fonction de la connexion de l'utilisateur. Imaginez que vous soyez connecté au Wi-Fi, mais à un point d'accès mobile qui ne propose que des débits 2G. L'API indiquerait le Wi-Fi.
console.log(navigator.connection.type);
> wifi
Dans Chrome 62, l'API a été étendue pour fournir des métriques de performances réseau réelles à partir du client. Ces signaux de qualité du réseau vous permettent d'adapter le contenu au réseau. Par exemple, sur des connexions très lentes, vous pouvez améliorer les performances de chargement de la page en diffusant une version réduite.
Pour simplifier votre logique d'application, l'API renvoie les performances réseau mesurées en termes de comparaison avec une connexion au réseau mobile. Par exemple, si vous êtes connecté à une connexion fibre ultrarapide, l'API indique 4G.
console.log(navigator.connection.effectiveType);
> 4G
Ces signaux seront également disponibles en tant qu'en-têtes de requête HTTP et activés via les indices client. Pour en savoir plus, consultez l'exemple et la spécification.
Polices variables OpenType
Traditionnellement, une police ne contenait qu'une seule instance d'une famille de polices, par exemple une épaisseur ou une élongation. Si vous souhaitez utiliser une police standard, en gras et en italique, vous devez inclure trois polices distinctes, ce qui alourdit votre page.
Une police variable OpenType est l'équivalent de plusieurs polices individuelles qui peuvent être empaquetées de manière compacte dans un seul fichier de polices. En ajustant la propriété CSS font-variation-settings, vous pouvez facilement ajuster l'étirement, le style, l'épaisseur, etc., ce qui vous permet d'obtenir un nombre infini de variations stylistiques. Ces trois polices peuvent désormais être combinées dans un seul fichier compact.
.heading {
font-family: "Avenir Next Variable";
font-size: 48px;
font-variation-settings: 'wght' 700, 'wdth' 75;
}
.content {
font-family: "Avenir Next Variable";
font-size: 24px;
font-variation-settings: 'wght' 400;
}
Les polices variables OpenType nous offrent un nouvel outil puissant pour créer une typographie responsive et réduire le poids de nos pages. Pour en savoir plus, consultez l'article Introducing OpenType Variable Fonts (Polices variables OpenType) de John Hudson.
Capture de contenu multimédia à partir d'éléments DOM
Vous pouvez désormais capturer en direct du contenu dans un MediaStream directement à partir de HTMLMediaElements, comme pour l'audio et la vidéo, à l'aide de la capture multimédia à partir de l'API DOM Elements.
Après avoir appelé captureStream() sur un élément multimédia HTML, le contenu diffusé peut être manipulé, traité, envoyé à distance ou enregistré. Imaginez utiliser l'audio Web pour créer votre propre égaliseur ou vocoder. Vous pouvez également diffuser le contenu sur un site distant à l'aide de WebRTC. Les possibilités sont presque infinies.
Étiquettes "Non sécurisé" pour certaines pages HTTP
Comme nous l'avons annoncé précédemment, à partir de Chrome 62, lorsqu'un utilisateur saisit des données sur une page HTTP, Chrome indique qu'elle est "non sécurisée" à l'aide d'un libellé dans la barre d'adresse. Ce libellé s'affiche également en mode navigation privée pour toutes les pages HTTP.
Et bien plus !
Ce ne sont là que quelques-unes des modifications apportées à Chrome 62 pour les développeurs.
- L'API Payment Request est désormais disponible sur Chrome pour iOS.
- Vous pouvez commencer à créer des expériences VR avancées expérimentales avec l'essai de l'origine WebVR.
Ensuite, abonnez-vous à notre chaîne YouTube. 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 63 sera disponible, je vous présenterai les nouveautés de Chrome.