Дата публикации: 10 ноября 2026 г.
В новую эру агентной веб-разработки разработчики ожидают, что их агенты кодирования будут экспертами в создании веб-сайтов. И хотя современные модели ИИ для программирования достаточно эффективны и обычно могут создать что-то работающее, если вы попросите эксперта по веб-разработке проверить созданный ИИ код, он почти всегда найдет способы сделать его быстрее, доступнее или безопаснее.
Chrome активно инвестирует в будущее веб-разработки с помощью агентов. Чтобы решить эту проблему, в мае на Google I/O мы представили предварительную версию Modern Web Guidance. Это набор навыков, которые встраивают знания о веб-платформе, рекомендации и данные о совместимости браузеров непосредственно в ваших агентов по программированию.
Сегодня мы рады объявить о стабильном выпуске Modern Web Guidance версии 1.0, которая включает:
- Новый рабочий процесс модернизации, который сканирует существующую базу кода, чтобы помочь агенту найти возможности для безопасной модернизации.
- Расширенная база данных руководств, в которой собраны сотни проверенных экспертами кросс-браузерных решений для пробелов в знаниях ИИ.
- Более тщательная проверка специалистами каждого руководства, включая утверждение техническими руководителями по контенту и специальную проверку доступности руководств для пользователей.
- Полный охват оценки во всех наших руководствах с общедоступной панелью оценки, показывающей измеримые улучшения по сравнению с агентами без Modern Web Guidance.
Мы также рады сообщить, что с выходом версии 1.0 Modern Web Guidance становится кросс-браузерным проектом. Firefox и Edge присоединяются к Chrome, чтобы поддерживать и улучшать кросс-браузерную совместимость и вносить свой вклад в проект. Опираясь на наш совместный проект Baseline, мы стремимся к тому, чтобы каждый, кто пишет код с помощью агента, мог в полной мере использовать возможности современной веб-платформы.
Независимо от того, какие модели или агентные обвязки вы используете, если вы разрабатываете веб-приложения, Modern Web Guidance должно быть частью вашего агентного рабочего процесса.
Чтобы установить Modern Web Guidance, выполните следующую команду в каталоге проекта:
npx modern-web-guidance@latest install
Если у вас уже установлена более ранняя версия, вы можете обновить ее до 1.0, выполнив следующую команду:
npx modern-web-guidance@latest update
Дополнительные инструкции по установке и подробную информацию можно найти в документации по Modern Web Guidance. Также рекомендуем посмотреть это видео:
Почему разработчикам и компаниям стоит использовать Modern Web Guidance
Нельзя отрицать, что агенты для программирования помогают разработчикам писать код быстрее, чем когда-либо. Но в мире, где все используют агентов для программирования, скорость больше не является конкурентным преимуществом.
Сейчас как никогда важно выделяться за счет таких фундаментальных факторов, как удобство использования и качество взаимодействия. Вот несколько примеров того, как можно использовать Modern Web Guidance:
Усилить рекомендации, которые модели часто упускают из виду.
Хотя передовые модели программирования хорошо справляются со многими задачами, наши оценки показывают, что есть ряд важных областей, в которых они не справляются, например:
- Специальные возможности. Фокус клавиатуры и управление инертными элементами, поддержка уменьшения движения и доступная проверка форм.
- Удобство использования. Жесты пролистывания и касания, переходы между диалоговыми окнами и всплывающими элементами, а также реализация светлой и тёмной тем.
- Производительность. Планирование задач в основном потоке, изоляция отрисовки за пределами экрана и предотвращение сдвига макета.
- Безопасность. Безопасная очистка HTML, строгие правила защиты контента и управление ключами доступа.
Соблюдать рекомендации по специальным возможностям особенно важно, поскольку ошибки, например неправильное использование ARIA, могут сделать страницу менее доступной, чем если бы ARIA не использовался вообще. Для версии 1.0 наши пользовательские руководства были проверены и протестированы с реальными вспомогательными технологиями экспертами по специальным возможностям, которые полагаются на них каждый день.
Используйте наиболее подходящую веб-функцию
ИИ-модели очень хорошо понимают, как заставить что-то работать с помощью JavaScript, но во многих случаях есть функции HTML или CSS, которые могут делать то же самое с гораздо меньшим количеством кода. А поскольку они обрабатываются браузером, они обычно работают лучше и имеют специальные возможности. Пример:
- Функции для анимации всплывающих окон и диалогов
- Функции для улучшения взаимодействия на основе прокрутки и пролистывания
- Улучшенные API для плавных переходов между страницами
Новые функции также могут улучшить работу сайта, что важно для пользователей. Пример:
- Ключи доступа и WebAuthn. Более быстрый и безопасный вход.
- Автозаполнение. Позволяет улучшить процесс оформления заказа (особенно на мобильных устройствах), который часто прерывается при использовании специальных элементов управления формой на основе JavaScript.
Modern Web Guidance рекомендует лучшие функции для работы с учетом требований к поддержке браузера. В руководства встроены данные о Baseline и совместимости с браузерами, поэтому рекомендации адаптируются к потребностям вашего проекта.
Сканируйте базу кода и находите возможности для модернизации
Большинство веб-разработок не происходит в совершенно новых проектах. Это происходит в существующих базах кода, в которых за годы накопились устаревшие обходные пути, ненужные зависимости и полифилы, которые больше не нужны.
В версии 1.0 добавлен новый рабочий процесс модернизации, который может анализировать существующий код HTML, CSS, JavaScript и package.json, чтобы находить возможности для безопасного обновления, а затем направлять агента по изменениям.
/modern-web-guidance Modernize the code in this directory
В первой версии процесса модернизации используется статический анализ для проверки ограниченного набора шаблонов. Мы решили начать с узкой области, которая дает предсказуемые результаты, а затем расширить ее. Со временем мы планируем охватить больше областей, включая аудит агентов, когда агент анализирует ваш код напрямую, а не просто сопоставляет известные шаблоны.
Следите за развитием веб-платформы
Веб-платформа постоянно развивается. С каждым новым выпуском браузера в нем появляются новые функции, а существующие, которые вы, возможно, не могли использовать раньше, становятся базовыми.
Поскольку Modern Web Guidance основан на данных о совместимости Baseline, а рекомендации поддерживаются инженерами браузеров, экспертами по веб-стандартам и специалистами по специальным возможностям, эти рекомендации развиваются вместе с самой платформой, и теперь ваш проект тоже может развиваться.
Узнайте о новых веб-функциях и рекомендациях
Хотя Modern Web Guidance – это в первую очередь инструмент для агентов, многие разработчики отмечают, что он полезен и сам по себе как учебный ресурс.
Даже в эпоху агентного программирования по-прежнему важно развивать знания в предметной области. В этом вам поможет Modern Web Guidance. Вы можете читать руководства или использовать CLI для поиска примеров использования и новых методов, которые могут быть полезны для вашего проекта.
Как использовать Modern Web Guidance с инструментами разработчика Chrome для агентов
В агентной веб-разработке написание кода – это лишь часть рабочего процесса. Вам также необходимо запустить этот код, чтобы убедиться, что он работает должным образом. Поэтому мы рекомендуем разработчикам использовать Modern Web Guidance вместе с инструментами разработчика Chrome для агентов.
- Modern Web Guidance дает агенту знания, необходимые для написания кода в соответствии с современными рекомендациями.
- Инструменты разработчика Chrome для агентов позволяют агенту проверять, отлаживать и оптимизировать код с учетом возможностей устройств, предпочтений пользователей и условий сети.
Это помогает агенту быстрее находить более подходящие решения. Ниже приведены примеры того, как можно использовать эти инструменты вместе, чтобы добиться максимальной эффективности.
Оптимизируйте кампанию, пока не достигнете цели эффективности
Modern Web Guidance может научить агента эффективно разбивать длительные задачи JavaScript, которые блокируют основной поток, но не может протестировать код, чтобы узнать, как долго эти задачи JavaScript на самом деле блокируют основной поток.
С помощью инструментов разработчика Chrome для агентов вы можете запустить трассировку производительности на симулированном ЦП низкого уровня, чтобы проверить, есть ли проблема. Затем вы можете использовать рекомендации по производительности из Modern Web Guidance, чтобы выполнять итерации, пока ваш код не перестанет блокировать основной поток более чем на 50 миллисекунд (чтобы не ухудшать INP).
Тестирование и доработка анимации
Modern Web Guidance может показать агенту, как правильно и эффективно анимировать такие функции, как модальные диалоговые окна, подсказки и всплывающие меню, но даже с этим руководством вам все равно нужно убедиться, что анимация действительно работает и хорошо выглядит при использовании в контексте вашего полного приложения.
Инструменты разработчика Chrome для агентов могут запустить ваш код, взаимодействовать со страницей и записать видео с экрана, чтобы показать анимацию в действии. Затем она может изучить запись, чтобы убедиться, что анимация работает и соответствует стилю и атмосфере остальной части сайта.
Вы также можете использовать инструменты разработчика Chrome для агентов, чтобы убедиться, что при установке prefers-reduced-motion компонент учитывает настройки пользователя.
Кеширование представлений без утечек памяти
Modern Web Guidance может научить вашего агента делать переходы в одностраничных приложениях мгновенными, отрисовывая и кешируя представления в памяти и скрывая их из дерева специальных возможностей.
Однако при этом важно правильно удалять неиспользуемые представления, чтобы не допустить утечки памяти, если пользователь долго остается на странице. В инструментах разработчика Chrome для агентов есть инструменты отладки памяти, которые позволяют агенту следить за тем, чтобы использование памяти не увеличивалось бесконтрольно.
Чтобы узнать больше о том, как использовать Modern Web Guidance и инструменты разработчика Chrome для агентов, посмотрите это видео:
Истории успеха
Команды разработчиков по всему миру уже используют Modern Web Guidance и инструменты разработчика Chrome для агентов, чтобы улучшать качество кода, ускорять доставку и устранять узкие места при отладке вручную.
Pensionbazaar и Policybazaar
Pensionbazaar – новая платформа для планирования выхода на пенсию, запущенная индийской финтех-компанией Paisabazaar. Ее разработчики использовали Modern Web Guidance и инструменты разработчика Chrome для агентов, чтобы создавать и проверять новые страницы. Это позволило более чем на 90 % сократить время выполнения задач (примерно с четырех дней до нескольких часов) и уменьшить количество ошибок в интерфейсе на новых экранах. Ее дочерняя платформа Policybazaar, одна из ведущих страховых платформ в Индии с более чем 97 миллионами зарегистрированных клиентов, использовала инструменты разработчика Chrome для агентов, чтобы автоматизировать аудит производительности примерно 30 целевых страниц с высоким трафиком, сократив объем ручной работы на 92 %.
"При создании Pensionbazaar мы с самого начала стремились писать качественный код, чтобы избежать технических проблем в будущем. Modern Web Guidance помог нашему агенту по программированию внедрить современные веб-стандарты и лучшие практики производительности, соблюдая при этом наши конкретные цели совместимости с браузерами. Это значительно упростило и ускорило проверку кода интерфейса, что в конечном итоге сократило время разработки".
— Аман Сони (Aman Soni), технический директор, Policybazaar
WeTV
WeTV, международная платформа Tencent для потоковой передачи видео, добавила в свой конвейер CI/CD ИИ-агента для написания кода. Он использует инструменты разработчика Chrome для агентов, чтобы диагностировать снижение производительности, и Modern Web Guidance, чтобы устранять проблемы с помощью современных функций веб-платформы. Теперь агент автоматически диагностирует и устраняет 90 % сбоев при проверке производительности, сокращая время отладки и устранения неполадок на 87 % (с четырех часов до 30 минут, включая ручную оценку):
"Результаты оказались очень хорошими и с точки зрения скорости, и с точки зрения качества. Выводы диагностики, предоставленные инструментами разработчика Chrome для агентов и Modern Web Guidance, дали нам надежные рекомендации по устранению сложных проблем с макетом. После каждого исправления мы проводим строгую проверку. Текущая доля успешных запросов и стабильность значительно повысили нашу уверенность в выпусках".
— Янцзе Чжэн (Yangjie Zheng), руководитель отдела разработки, WeTV (Tencent)
note inc.
note inc. – одна из крупнейших в Японии платформ для авторов и медиа, у которой более 90 миллионов активных пользователей за месяц. Компания использовала Modern Web Guidance вместе с собственной системой проектирования, чтобы модернизировать клиентскую часть Next.js. В ходе 180-проходной оценки рабочей базы кода Modern Web Guidance повысил процент успешных проверок современных веб-технологий с 61 % до 94 %, направляя агентов на использование нативных функций HTML и CSS вместо пользовательского JavaScript для анимации прокрутки, подсказок и аккордеонов. Кроме того, в 431 объединенном запросе на включение на 28 % увеличилось количество случаев, когда приоритет был правильно назначен самому крупному изображению.
"Миссия note – помогать авторам начать и продолжать творить. Поэтому наша платформа должна быть быстрой и доступной для каждого автора и читателя. Поскольку все больше нашего кода пишется с помощью агентов кодирования ИИ, Modern Web Guidance помогает им находить современные решения, основанные на стандартах, вместо того, чтобы возвращаться к старым шаблонам JavaScript. Он также указывает на детали, которые легко упустить, например, приоритет загрузки изображений и доступность формы. В сочетании с нашей системой проектирования это позволяет нам постоянно улучшать Note, сохраняя единообразие пользовательского интерфейса".
— Такехико Итабаси (Takehiko Itabashi), вице-президент по технологиям, note inc.
MetaMask
MetaMask – это некастодиальная финансовая платформа, которую скачали более 100 миллионов раз примерно в 190 странах. Modern Web Guidance используется в ней как бот для автоматической проверки каждого pull-запроса к расширению браузера с открытым исходным кодом. Для настройки бота потребовался запрос всего из трех строк. За первые пять недель бот проверил около 480 pull-запросов и прокомментировал 64 из них. В результате инженеры исправили 43 ошибки (в основном связанные со специальными возможностями, семантикой HTML и формами, которые не обнаруживаются линтерами). Медианное время от комментария до исправления составило 15 минут.
"Отзывы очень полезны. Они помогли нам найти и познакомить наших инженеров с современными API, такими как Interest invokers и Popover API. Это не увеличило время проверки PR, а скорее сократило его. В противном случае для выявления проблем, обнаруженных MWG, потребовался бы специалист, знакомый с этими современными веб-технологиями".
– Фрэнсис Непомусено (Francis Nepomuceno), UX-инженер, MetaMask
Поддержка экосистемы и сообщества
Инициатива Modern Web Guidance зародилась в команде Chrome, но в создании версии 1.0 участвовали многие эксперты из веб-сообщества.
Мы благодарим технических руководителей, которые курировали работу над каждым разделом платформы, наших партнеров из Firefox и Edge, независимых экспертов по веб-стандартам и специальным возможностям, которые создавали и тестировали руководства, а также всех участников проекта с открытым исходным кодом на GitHub, которые помогли нам подготовить этот выпуск.
Если вы заметили пробел в знаниях агентов программирования о веб-технологиях или хотите помочь улучшить существующее руководство, ознакомьтесь с руководством по участию.
Начало работы с Modern Web Guidance
Чтобы добавить Modern Web Guidance в проект, запустите установщик CLI из каталога проекта:
npx modern-web-guidance@latest install
Если у вас уже установлена более ранняя версия, вы можете обновить ее до 1.0, выполнив следующую команду:
npx modern-web-guidance@latest update
Помимо CLI, вы можете установить и обновить Modern Web Guidance напрямую через большинство популярных торговых площадок с плагинами агентов для программирования, включая Claude Code, Codex, Cursor, Antigravity, Copilot, WebStorm, Kimi Code и Grok Build.
Подробную информацию можно найти в этих ресурсах: