Publié le 31 mars 2025
Un autre mois s'est écoulé depuis le dernier récapitulatif mensuel de Baseline, et il s'est passé beaucoup de choses ! Dans cette édition, nous allons récapituler certains articles que nous avons publiés sur web.dev, certaines nouvelles fonctionnalités de référence disponibles et quelques modifications apportées aux outils de la communauté.
ESLint 0.6.0 est disponible
Récemment, nous avons annoncé le lancement de la prise en charge du linting CSS par ESLint. Cette nouveauté inclut une nouvelle règle ESLint (require-baseline) pour analyser les fonctionnalités CSS que vous utilisez dans votre projet et déterminer si elles atteignent un seuil de référence spécifique.
ESLint a récemment lancé la version 0.6.0 du package @eslint/css, qui comprend une nouvelle mise à jour importante qui renomme la règle require-baseline en use-baseline. Bien que cette mise à jour semble mineure, elle améliore la lisibilité de la règle. Cette version comprend également d'autres fonctionnalités importantes et des corrections de bugs, comme la possibilité d'utiliser la règle use-baseline pour analyser les blocs CSS imbriqués. Si vous utilisez une version antérieure de @eslint/css, découvrez cette mise à jour.
Interroger le tableau de bord de la plate-forme Web
Plus tôt ce mois-ci, nous avons publié un article sur l'interrogation du tableau de bord de la plate-forme Web. Vous pouvez interroger ce tableau de bord sur son interface utilisateur, ainsi que via une API HTTP. Cela peut être utile pour les outils de référence, car vous pouvez interroger l'API pour trouver les fonctionnalités qui ont atteint un seuil de référence spécifique.
Cette API peut être utile pour les outils dans lesquels vous devez obtenir rapidement des informations sur des fonctionnalités spécifiques. Par exemple, vous pouvez utiliser ce type d'outils pour écrire un script qui vous indique à intervalles réguliers quelles fonctionnalités sont récemment disponibles en version de référence ou largement disponibles. Si cela vous intéresse, consultez cet article.
Comment envisager la variante de référence et les polyfills
La mission de Baseline est de clarifier les fonctionnalités que vous pouvez utiliser en toute sécurité. Toutefois, même avec cette clarification, vous devez toujours réfléchir à la manière d'adopter les fonctionnalités de manière logique pour vos applications Web. Les remplissages polyfills jouent un rôle important dans ce processus. La référence ne tient pas compte des polyfills pour déterminer si les fonctionnalités sont disponibles récemment ou largement, et ne vous indique pas si vous devez les utiliser. Cette décision est spécifique à votre application, mais elle est importante.
Nous avons récemment publié un article sur la façon de penser aux références et aux polyfills. Nous pensons qu'il fournit un cadre utile pour réfléchir à leur utilisation. L'objectif est que les fonctionnalités de référence nouvellement ou largement disponibles deviennent moins nécessaires. Il ne fait aucun doute que les polyfills sont des outils utiles dans votre boîte à outils de développement, mais ils présentent des inconvénients. Ils peuvent avoir un impact négatif sur les performances de votre site Web et, dans certains cas, peuvent même poser des problèmes d'accessibilité. Nous espérons que ce guide vous aidera à répondre à cette question délicate.
contenteditable="plaintext-only" est désormais disponible en tant que référence
L'attribut contenteditable d'un élément HTML permet à l'utilisateur de modifier son contenu comme s'il s'agissait d'un champ de texte. Par exemple, vous pouvez placer l'attribut sur un élément <p> et l'utilisateur peut interagir avec lui comme avec un <textarea>. Dans certains cas d'utilisation, l'utilisation de contenteditable offre des avantages par rapport aux éléments de formulaire standards.
Toutefois, les utilisateurs collent du contenu dans des éléments modifiables, et ce contenu peut contenir une mise en forme de texte enrichi, ce qui peut être frustrant pour les utilisateurs qui souhaitent simplement coller du texte non formaté dans un champ. La combinaison attribut/valeur contenteditable="plaintext-only" empêche cela de se produire. Elle est récemment devenue disponible en tant que référence. Pour en savoir plus, consultez le post d'annonce et découvrez comment offrir une meilleure expérience de modification aux utilisateurs qui souhaitent simplement coller du texte dans des éléments sans fioriture.
Intl.DurationFormat est désormais disponible en tant que référence
Vous avez probablement déjà consulté un site Web et vu un texte indiquant la durée avant ou après un événement, souvent sous la forme d'une chaîne comme "2 jours, 6 heures, 3 minutes". Ces données sont utiles pour communiquer un certain nombre d'informations à jour, mais elles sont souvent fournies par une bibliothèque. De plus, vous pouvez souhaiter générer ces informations dans plusieurs langues.
Intl.DurationFormat est une fonctionnalité d'internationalisation qui est récemment devenue disponible en tant que référence. Avec la classe Intl.DurationFormat, vous pouvez transmettre un objet à son constructeur contenant les unités de temps que vous souhaitez mettre en forme sous forme de chaîne, et dans presque n'importe quel langage:
const duration = {
years: 1,
hours: 20,
minutes: 15,
seconds: 35
};
// English output: '1 year, 20 hours, 15 minutes, 35 seconds'
new Intl.DurationFormat('en', { style: 'long' }).format(duration);
// German output: '1 Jahr, 20 Stunden, 15 Minuten und 35 Sekunden'
new Intl.DurationFormat('de', { style: 'long' }).format(duration);
// Spanish output: '1 año, 20 horas, 15 minutos y 35 segundos'
new Intl.DurationFormat('es', { style: 'long' }).format(duration);
L'aspect intéressant de cette fonctionnalité est que si votre application s'appuie sur une bibliothèque pour mettre en forme des chaînes comme celle-ci, vous pourrez bientôt le faire sans bibliothèque, ce qui permettra d'économiser des kilo-octets pour vos utilisateurs. Pour en savoir plus, consultez cet article d'annonce sur Intl.DurationFormat et découvrez comment profiter de cette nouvelle fonctionnalité pratique.
Référence au W3C Breakouts Day 2025
Récemment, le W3C a organisé l'édition 2025 de son "Breakouts Day", au cours duquel les membres ont présenté différents sujets. Le 26 mars, une session utile sur la référence a été proposée.
Si vous débutez avec Baseline, cette session vous donnera un aperçu rapide. Il couvre les bases de la référence, comme les concepts de nouveautés et de disponibilité générale, mais explique également comment ces définitions sont déterminées par les données, à partir de browser-compat-data jusqu'aux données web-features qui nous aident à déterminer quelles fonctionnalités atteignent quel seuil de référence.
Si vous avez manqué cette session, ne vous inquiétez pas. Les diapositives de la session sont déjà disponibles. N'hésitez pas à les consulter si votre curiosité vous pousse à le faire.
C'est terminé !
Cette édition du récapitulatif mensuel ne marque pas seulement la fin du mois, mais aussi du trimestre. Si vous avez manqué les versions précédentes de ce récapitulatif, consultez les éditions de janvier et de février pour vous tenir informé de tout ce qui s'est passé avec Baseline au cours du premier trimestre de cette année. Comme d'habitude, n'hésitez pas à nous en informer si nous avons manqué des informations sur la référence. Nous nous assurerons de les inclure dans une prochaine édition. À bientôt dans un mois !