Modern Web Guidance : faire adopter à l’agent de code les écritures modernes de la plateforme Web

À qui ça s’adresse

Si un agent de code empile de gros volumes de JavaScript daté dès qu’apparaissent calques, animation ou interaction, et que vous voulez les capacités déjà fournies par la plateforme Web actuelle, cet ensemble convient mieux. Il encastre expérience plateforme Web, bonnes pratiques et données de compatibilité navigateur dans l’agent de code, pour faire basculer les solutions des anciens modèles vers la plateforme moderne, pas pour écrire encore un tutoriel front-end générique.

Explication officielle : les agents de code reprennent souvent les anciens modèles, car les données d’entraînement contiennent beaucoup de code héritage, et produisent souvent des scripts gonflés pour des tâches qui ont déjà une solution native performante. Si vous travaillez sur des boîtes de dialogue, des animations de couche supérieure ou des contrôles de compatibilité, et acceptez d’installer un ensemble avec npx, le bénéfice est plus direct. Qui veut seulement parcourir la doc et ne compte pas changer le comportement de l’agent peut d’abord voir la recherche en ligne de commande, sans lancer l’assistant d’installation.

Premier essai en 3 minutes

L’entrée d’installation officielle n’est que celle-ci :

npx modern-web-guidance@latest install

Elle lance un assistant interactif et installe Modern Web Guidance dans votre agent de code. Cela change la configuration de skills de l’agent sur cette machine ; ce n’est pas une requête en lecture seule. Avant d’exécuter, confirmer : cette machine a npx, vous voulez terminer les choix dans l’assistant, et c’est l’environnement d’agent où écrire. Lire les invites, puis exécuter ; ne pas faire Entrée dans un environnement obscur.

Après installation, un contrôle réversible : demander à l’agent d’examiner « comment animer le fond d’une boîte de dialogue » et exiger qu’il regarde d’abord les capacités modernes, sans écrire d’abord un long script. Signal de succès : la réponse s’appuie sur solutions de plateforme et compatibilité, au lieu d’empiler par défaut des écritures héritage. Si l’agent ne donne encore que d’anciens modèles, s’arrêter au contrôle ; ne pas le laisser changer des fichiers du dépôt.

Si vous n’êtes pas prêt à écrire dans l’agent, vous pouvez d’abord utiliser la même CLI en recherche lecture seule (section suivante). Cette étape ne remplace pas l’installation ; elle confirme seulement que la commande marche.

Cas d’usage

Cas 1 : Rechercher des guides liés à une tâche. Vous avez déjà un besoin concret, par exemple animer le fond d’une boîte de dialogue, sans encore connaître le nom du guide. Dans le terminal :

npx modern-web-guidance@latest search "animate a dialog modal backdrop"

La page officielle le marque Search for relevant guides. Elle n’écrit ni le nombre de lignes renvoyées, ni le tri, ni s’il faut installer d’abord. Vous ne pouvez confirmer que : cette commande cherche des guides par mot-clé. Voir des entrées liées à dialogue, fond et animation suffit ; elle ne vous autorise pas à traiter les résultats comme un rustine finale à coller.

Cas 2 : Extraire un guide par ID connu. Quand vous avez déjà vu un identifiant comme animate-to-from-top-layer, exécuter :

npx modern-web-guidance@latest retrieve "animate-to-from-top-layer"

La page officielle le marque Retrieve a guide by ID. Elle n’explique pas l’inventaire complet des ID, ni si retrieve change des fichiers du projet. La première fois, lire la sortie seulement comme corps de guide. Pour la poser dans le code, la passer à un agent de code déjà équipé de la skill pour comparaison, et lui interdire clairement de changer des fichiers avant votre accord.

Limites d’usage

C’est une préversion. Le texte officiel dit que le contenu continue d’augmenter, et accueille contributions ou retours sur

https://github.com/GoogleChrome/modern-web-guidance-src

La page ne garantit pas que les guides couvrent toute la plateforme Web, ni que les commandes de la période de préversion sont stables. Si un sujet est introuvable, cela dit seulement que le contenu actuel ne l’a pas encore ; ne pas inventer une « bonne pratique équivalente ».

Le chemin d’installation est l’assistant interactif ci-dessus ; recherche et extraction sont deux autres commandes. Ne pas comprendre search / retrieve comme un second installeur, ni en déduire qu’il est lié à un produit d’agent. Le texte officiel dit seulement coding agents, sans liste de clients.

La première fois, préférer la recherche ou une comparaison en lecture seule par l’agent. L’assistant écrit des skills ; retrieve ne déclare pas non plus s’il est affichage seul. Toute étape qui changerait le dépôt ou la configuration doit d’abord faire réciter à l’agent les fichiers à changer ; vous confirmez, puis continuez.