Попросите агента «сделать модальное окно» — и он принесёт сорок строк JavaScript: обработчики, focus-trap, div вместо кнопки. Не потому что не знает про
<dialog>, а потому что легаси-кода в его обучении больше, чем современного. Google придумал, как это лечить, и стоит это одну команду.Что это вообще такое
Modern Web Guidance — набор скиллов для кодинг-агентов от команды Chrome (поддержала ещё и команда Edge). Не библиотека и не фреймворк: это гайды, которые подкладываются агенту в контекст, когда задача касается веба. Внутри — 108 современных возможностей платформы: 54 в CSS и вёрстке (container queries, subgrid, oklch, text-wrap, View Transitions), 21 в HTML и DOM, 33 в JS и API. Сверху готовые сценарии: «переведи модалку на
<dialog>», «тултипы на Popover API», «почини INP», «поставь стартовый CSP».Как это работает
Никакой сети и никаких ключей: CLI гоняет локальный поиск по гайдам на TensorFlow.js. Агент активирует скилл, ищет «animate a dialog modal backdrop», получает нужный гайд и вставляет в контекст его — а не всю документацию: гайд про light dismiss весит 1092 токена, большой гайд по HTML — 5587. Мы прогнали поиск у себя: он вернул пять гайдов с рейтингом совпадения, от модалки до доступности. Работает как обещано.
Как повторить за 20 минут
1. Поставить:
npx modern-web-guidance@latest install (есть варианты для Claude Code, Copilot CLI и npx skills add GoogleChrome/modern-web-guidance). 2. Спросить своими словами, не называя API: «модалка, закрывается по клику вне». 3. Проследить, чтобы агент не тащил тяжёлый полифилл: гайды разрешают лёгкие фоллбэки до 50 строк. 4. Сверить поддержку с Baseline — данные о совместимости скилл подтягивает сам. 5. Рядом поставить Chrome DevTools MCP (52,3 тыс. звёзд): агент получает живой браузер, аудит и консоль.Что нравится и где я не верю
Google померил пользу: на 132 задачах с 1124 проверками агенты без скилла проходили 54–65%, со скиллом — 81–91%, то есть плюс 22–33 процентных пункта. Это цифры самих авторов, и на реальных проектах разрыв будет скромнее. Статус — early preview: 108 фич есть, остального пока нет. И телеметрия: Google собирает счётчики установок и поисковые запросы агента, сами промпты — нет.
Пакету полгода: 36 тысяч скачиваний за неделю, лицензия Apache-2.0, ни одной зависимости. Дёшево попробовать и легко откатить — тот случай, когда «поставить и посмотреть» честнее, чем спорить о вкусах. Агенту всё равно, на каком стеке вы пишете: он выучил интернет десятилетней давности, и его надо немного подтянуть.
#apet #дизайн #AI #визуал