Google выкатила предварительную версию Modern Web Guidance. Это библиотека навыков для AI-агентов, которые пишут фронтенд. Проще говоря, агенту дают проверенные инструкции, и он меньше ломает код.
Самое важное, здесь не теория, а рабочие шаблоны. Они закрывают 4 боли сразу: интерфейсы, старый код, безопасность и скорость. Для команды это экономия часов на каждом релизе.
AI-агенту дали «шпаргалку» по веб-разработке, и это уже работает
Modern Web Guidance подключается через команды в CLI (интерфейс командной строки). Поддержка есть сразу для нескольких сред. Например, для Claude Code и Copilot CLI.
Это важно, потому что AI-ассистенты часто пишут код «почти правильно». А «почти» в продакшене стоит денег. Новый набор снижает риск таких промахов.
- Установка через npx: быстрое подключение в проект.
- Подключение через skills marketplace (маркетплейс навыков) от Vercel.
- Плагин-установка для Claude Code и Copilot CLI.
- Интеграция с Antigravity CLI.
- Связка с Chrome DevTools (инструменты разработчика) для проверок в реальном времени.
Официальная страница: developer.chrome.com. Репозиторий доступен и на GitHub: GoogleChrome/modern-web-guidance.
Что реально меняется в жизни команды, а не в презентации
Раньше разработчик просил AI «ускорить сайт» и получал набор общих советов. Теперь агент получает конкретные рецепты. И может сразу править нужные места в коде.
Пример 1: старые модальные окна. Навык переводит их на dialog (встроенный HTML-элемент для диалогов) и добавляет современные анимации. Меньше кастомного JavaScript (язык программирования), меньше багов.
Пример 2: старые подсказки. Их переводят на Popover API (веб-интерфейс для всплывающих блоков) и CSS Anchor Positioning (якорное позиционирование в CSS). Результат, чище верстка и стабильнее поведение на мобильных.
Пример 3: скорость. Навыки помогают настроить preload (предзагрузка ресурсов) при наведении на ссылку. Это может заметно улучшить LCP (скорость появления главного контента).
Пример 4: отзывчивость интерфейса. Агент ищет long tasks (долгие задачи процессора), которые портят INP (задержка отклика интерфейса). Потом предлагает правки по шагам, а не «магический» совет.
- UI (пользовательский интерфейс): аккордеоны, табы, адаптивные карточки через container queries (запросы к размеру контейнера).
- Legacy (устаревший код): миграции на современные API без полной переписи проекта.
- Security (безопасность): стартовый CSP (политика безопасности контента) и аудит уязвимостей.
- Performance (производительность): работа с LCP, INP и предзагрузкой страниц.
Зачем Google это делает и что стоит за релизом
Рынок уже понял, что AI пишет код быстро, но не всегда надежно. Следующий этап, дать агентам «правильные привычки». Google делает ставку именно на это.
По факту это стандарт качества для «кодинга с AI». Не просто генерация, а генерация с современными веб-практиками. Это снижает цену ошибки для бизнеса.
Есть и прагматика. Чем больше команд используют Chrome-ориентированные практики, тем стабильнее экосистема браузера. Выигрывают все, от фрилансера до продуктовой компании.
Как применить прямо сейчас, даже в маленькой команде
Если у вас 1-3 разработчика, начните с пилота на одном разделе сайта. Например, личный кабинет или каталог. Так вы быстро увидите разницу в скорости и количестве багов.
- Подключите Modern Web Guidance через npx или marketplace (маркетплейс).
- Выберите 1 метрику, например LCP (скорость главного контента).
- Дайте агенту конкретную задачу, например «исправь long tasks (долгие задачи) на странице оплаты».
- Проверьте результат в DevTools (инструменты разработчика) и сравните до/после.
- Только после этого масштабируйте подход на весь проект.
Маркетологам это тоже полезно. Быстрее страница, меньше отвалов в воронке. Предпринимателю проще, потому что правки делаются быстрее и дешевле.
Разработчикам плюс в другом. Вместо рутинных исправлений они фокусируются на логике продукта. AI берет черновую работу, а человек контролирует критичные решения.
Сколько это стоит и где подвох
Сама документация и навыки распространяются как открытый проект. Но есть косвенные расходы, время команды на внедрение и проверку. И это нормально для любого нового процесса.
Главный риск, слепо доверять автоправкам. Нужен базовый code review (проверка кода) и измерения метрик. Без этого даже хороший инструмент легко использовать плохо.
Еще момент, это предварительная версия. Контент будет меняться. Зато можно влиять на развитие через GitHub-обсуждения и фидбек.
Мы идем к миру, где «писать код» уже не главное. Главное, давать AI правильные рамки, чтобы он делал качественно с первого раза.