Modern Web Guidance – Votre agent IA va enfin goûter au code web moderne
Si vous codez avec l’aide d’un agent IA, vous l’avez sûrement déjà vu pondre des tartines de JavaScript pour faire une simple popup, alors que bon, le navigateur sait faire ça tout seul. Et la raison à cela est vraiment débile… En fait, c’est parce que ces modèles ont appris à coder à l’ancienne en se goinfrant notamment de montagnes de vieux code. Un peu, finalement comme un ingénieur qui aurait appris à coder à l’école et qui 15 ans après, n’a toujours pas pris la peine de se mettre un peu à la page en faisant de la veille sur son métier. Bah quoi, ça vous fait penser à quelqu’un ?? loool.
Heureusement, pour les agents IA, c’est une situation qui peut s’améliorer grâce à Modern Web Guidance qui tente de corriger ce défaut.
Modern Web Guidance ce c’est donc un skill, ce qui en langage de moldu veut dire "un gros paquet de consignes que votre agent va lire et qui lui ouvre un catalogue de guides sur les fonctionnalités natives du web". On y retrouve donc <dialog>, Popover API, container queries, mais aussi passkeys ou Content Security Policy et j’en passe… Et n’allez pas croire que c’est un n-ième vendeur de formation IA sur Twitter qui a dev ça comme produit d’appel… Non, non, c’est un vrai projet piloté par les équipes de Chrome, Edge, Firefox et MDN, donc c’est du sérieux.
Ce clic autorise une connexion à Google : adresse IP transmise et traceurs possibles.
En savoir plus
Si ça vous intéresse, pour l’installer, lancez cette commande depuis le dossier de votre projet. Il existe aussi des plugins pour Claude Code, Copilot, Codex ou Antigravity.
npx modern-web-guidance@latest install
Ensuite, quand vous demandez à votre agent de remplacer cette foutue vieille fenêtre modale par l’élément <dialog> et de l’animer, l’agent ira chercher la bonne façon de faire dans le catalogue de MWG (Modern Web Guidance) et chargera le bon guide, avec ses pièges connus et ses solutions de repli. Rassurez-vous, cette recherche tourne en local, sans clé API, et vous pouvez même la lancer vous-même comme ceci :
npx modern-web-guidance@latest search "animate a dialog modal backdrop"
Attention quand même, local ne veut pas dire muet puisque par défaut, Google collecte quand même le nom de votre agent, la liste des guides récupérés et les requêtes que l’agent génère… Ils ne peuvent pas s’en empêcher, ahahha. Par contre, ils ne collectent pas vos prompts, alors c’est déjà ça… Mais, n’empêche, je vous invite à couper ça quand même en ajoutant cette ligne dans votre .zshrc ou votre .bashrc :
export DISABLE_TELEMETRY=1
Et si vous taffez sur un vieux projet, MWG ajoute également un scan de vos fichiers HTML, CSS, JavaScript et package.json ce qui lui permet de repérer ce qui mériterait d’être modernisé. Google prévient qu’il ne recherche qu’un ensemble "limité" de motifs par analyse statique, donc voyez ça plutôt comme une liste de pistes à creuser et pas un vrai audit de code legacy.
npx modern-web-guidance@latest legacy-scan .
Bien sûr, comme toujours avec l’IA et ce genre de skills, rien ne garantit que l’agent utilise le bon guide, ni même qu’il le lise en entier, donc ne lui faites pas une confiance aveugle et jetez encore un petit œil au code.
Mais bon, c’est quand même chouette d’avoir un skill comme ça qui permet notamment de rendre son site web plus conforme avec les standards et donc plus accessible !
Source :
Modern Web Guidance sur GitHub
Source : korben.info