Publié le 28 juillet 2026
Chrome 151 est en cours de déploiement. Cet article présente certaines des principales fonctionnalités de cette version. Consultez les notes de version complètes de Chrome 151.
Points forts de cette version :
- L'élément de fonctionnalité
<usermedia>fournit un contrôle déclaratif activé par l'utilisateur pour les flux de caméra et de micro. - L'attribution d'emplacements Shadow DOM déclarative permet aux composants Web d'utiliser l'attribution manuelle d'emplacements sans JavaScript impératif.
- Les métriques de performances d'interaction et de navigation logicielle suivent la latence et les modifications de route basées sur l'interaction dans les applications monopages.
Élément de fonctionnalité : <usermedia> MVP
L'élément <usermedia> est le dernier à être lancé dans la suite d'éléments de fonctionnalité, après <geolocation>. Cette transition par rapport à la proposition <permission> d'origine, qui fait partie de l'initiative PEPC, permet au navigateur de gérer plus efficacement les complexités et les comportements uniques des différentes fonctionnalités matérielles. Alors que la proposition initiale se concentrait principalement sur la gestion des états d'autorisation, tels que l'autorisation ou le refus, les éléments de fonctionnalité fonctionnent comme des médiateurs de données.
L'élément <geolocation> fournit un objet de localisation à votre site, et <usermedia> gère l'ensemble du flux d'accès à la caméra et au micro. Il capture l'intention utilisateur, gère l'invite du navigateur et fournit l'objet MediaStream à l'application. Ce changement élimine le besoin d'appels getUserMedia() distincts, simplifie l'implémentation et garantit que le navigateur dispose d'un signal de confiance de l'intention de l'utilisateur.
Pour en savoir plus, consultez Présentation de l'élément HTML <usermedia>.
Shadow DOM déclaratif : attribut shadowrootslotassignment
Chrome 151 ajoute la prise en charge de l'attribut shadowrootslotassignment sur les éléments <template>. Vous pouvez ainsi créer des racines Shadow déclaratives qui utilisent l'attribution manuelle d'emplacements directement dans votre code HTML.
Jusqu'à présent, l'attribution manuelle d'emplacements n'était disponible qu'impérativement. Avec cette mise à jour, vous pouvez spécifier shadowrootslotassignment="manual" dans votre modèle de racine Shadow.
L'attribut accepte named (comportement par défaut) et manual, et est reflété par la propriété shadowRootSlotAssignment sur HTMLTemplateElement. Pour en savoir plus, consultez la documentation HTMLTemplateElement.shadowRootSlotAssignment sur MDN.
Cet attribut est déjà disponible dans Firefox et dans la version bêta de Safari 27. Il sera donc bientôt disponible dans Baseline.
Métriques de performances d'interaction et de navigation logicielle
Chrome 151 étend la timeline des performances Web en introduisant deux nouveaux types PerformanceEntry : soft-navigation et interaction-contentful-paint. Ces entrées aident les développeurs à suivre les performances et la latence basées sur l'interaction dans les applications monopages (SPA), en s'appuyant sur des métriques Core Web Vitals établies telles que Largest Contentful Paint (LCP) et Interaction to Next Paint (INP).
Dans une SPA, les transitions de route basées sur JavaScript ne déclenchent pas de chargement de page de navigateur traditionnel. L'entrée soft-navigation capture ces mêmes modifications d'état de l'historique de document initiées par les interactions de l'utilisateur. Lorsqu'une navigation logicielle se produit, le navigateur établit une nouvelle origine temporelle, ce qui vous permet d'attribuer avec précision les données sur les performances suivantes à la route SPA active plutôt qu'à l'URL du document initial.
L'entrée interaction-contentful-paint mesure les nouvelles peintures de contenu dans les régions DOM modifiées par une interaction de l'utilisateur. Cela permet de visualiser la latence de chargement des interactions, même lorsque les mises à jour de contenu dépendent d'opérations asynchrones telles que les requêtes fetch().
Vous pouvez observer ces nouvelles entrées dans votre application à l'aide d'un PerformanceObserver. L'extrait de code suivant enregistre les entrées de navigation logicielle dans la console, y compris les navigations logicielles précédentes sur cette page à l'aide de l'option mise en mémoire tampon :
const observer = new PerformanceObserver(console.log);
observer.observe({ type: "soft-navigation", buffered: true });
Pour en savoir plus sur l'implémentation et la mesure des navigations SPA, consultez la documentation sur les navigations logicielles dans Chrome pour les développeurs.
Documentation complémentaire
Cet article ne couvre que quelques points clés. Consultez les liens suivants pour découvrir les autres modifications apportées à Chrome 151 :
- Notes de version de Chrome 151.
- Mises à jour de ChromeStatus.com pour Chrome 151.
- Calendrier des versions de Chrome.
S'abonner
Pour ne rien manquer, abonnez-vous à la chaîne YouTube Chrome Developers. Vous recevrez une notification par e-mail chaque fois que nous publierons une nouvelle vidéo. Vous pouvez également nous suivre sur X ou LinkedIn pour découvrir de nouveaux articles et billets de blog.
Dès que Chrome 152 sera disponible, nous vous présenterons les nouveautés de Chrome.