Découvrez certaines des fonctionnalités intéressantes disponibles dans les navigateurs Web stables et bêta en juin 2022.
Versions stables du navigateur
En juin, Chrome 103 et Firefox 102 sont devenus stables.
Transformer des flux et des flux d'octets lisibles
Firefox 102 est compatible avec les flux de transformation. Cela permet de canaliser ReadableStream
vers un WritableStream
, en exécutant une transformation sur les segments. Nous sommes ravis de constater que cette fonctionnalité est disponible sur les trois moteurs. C'est le moment idéal pour en apprendre davantage sur les flux.
Les flux d'octets lisibles sont désormais également compatibles avec Firefox 102, ce qui permet d'utiliser un lecteur BYOB (Bring Your Own Buffer) avec l'interface ReadableStreamBYOBReader
. Il peut être utilisé pour diffuser les données fournies par le développeur.
Accéder aux polices installées localement
Chrome 103 inclut l'API Local Font Access, qui permet d'accéder aux polices installées localement par l'utilisateur. Après avoir demandé l'accès aux polices installées sur l'appareil, appelez window.queryLocalFonts()
pour obtenir un tableau des polices installées.
const pickedFonts = await window.queryLocalFonts();
for (const fontData of pickedFonts) {
console.log(fontData.postscriptName);
console.log(fontData.fullName);
console.log(fontData.family);
console.log(fontData.style);
}
Fonctionnalité multimédia update
Firefox 102 inclut la fonctionnalité multimédia update
. Permet de savoir si l'appareil de sortie peut modifier l'apparence du contenu une fois qu'il a été affiché.
Nouveau code d'état HTTP : 103 hints précoces
Chrome 103 ajoute un nouveau code d'état HTTP 103 "Early Hints" (Premiers indices). Si le serveur ou le CDN sait qu'un certain ensemble de sous-ressources est nécessaire pour charger une page, il peut conseiller au navigateur de préconnecter les origines ou même de précharger les ressources lorsque la page qui les nécessite arrive. Vous devez mettre à jour votre serveur ou votre CDN pour que vous puissiez bénéficier de cette fonctionnalité. En savoir plus sur les premiers indices
Versions bêta du navigateur
Les versions bêta du navigateur vous donnent un aperçu des éléments qui seront disponibles dans la prochaine version stable du navigateur. C'est le moment idéal pour tester les nouvelles fonctionnalités ou les suppressions qui pourraient avoir un impact sur votre site avant que tout le monde ne les ait.
Les nouvelles versions bêta d'avril étaient Chrome 104, Firefox 103 et Safari 16.
Nouvelle syntaxe pour les requêtes média associées à une plage
Chrome 104 inclut la nouvelle syntaxe des requêtes multimédias de plage, issue de la spécification de niveau 4 des requêtes multimédias. Par exemple, une requête multimédia qui était auparavant écrite comme suit :
@media (min-width: 400px) { … }
peut désormais être écrit comme suit :
@media (width >= 400px) { … }
API Region Capture
Chrome 104 sur ordinateur inclut également l'API Region Capture. Cela permet de recadrer et de supprimer le contenu de la vidéo capturée avant de la partager.
Safari 16 apporte plusieurs fonctionnalités clés au navigateur
Safari 16 s'annonce comme une autre version passionnante de la part de l'équipe Safari. Cette version ajoute de nombreuses fonctionnalités incluses dans Interop 2022. Nous sommes ravis de voir autant de nouveautés à mi-année. Je mets en avant quelques-unes de mes fonctionnalités préférées, mais consultez les notes de version pour en savoir plus.
Comme de nombreux développeurs, je suis ravi de voir que les requêtes de taille sont compatibles avec les requêtes de conteneur, une fonctionnalité qui est également associée à un indicateur dans Chrome.
Safari 16 est également compatible avec la valeur subgrid
pour grid-template-columns
et grid-template-rows
. Cette fonctionnalité est déjà disponible dans Firefox et en cours de développement dans Chrome. Elle permet d'hériter de la taille des canaux de grille par les grilles imbriquées.
La mise en page en grille permet également d'animer les canaux de la grille.
Navigateurs pris en charge
La méthode showPicker()
, qui permet d'afficher un sélecteur de navigateur pour les dates, l'heure, la couleur et les fichiers, est incluse. Pour en savoir plus, consultez Afficher un sélecteur de navigateur pour la date, l'heure, la couleur et les fichiers.
Les problèmes d'accessibilité pour display: contents
ont également été résolus, ce qui permet d'utiliser cette fonctionnalité utile en toute sécurité, sans risque de supprimer des éléments de l'arborescence d'accessibilité.
Ces fonctionnalités bêta seront bientôt disponibles dans les navigateurs stables.
Partie de la série Nouveau sur le Web