Избавляем ИИ от устаревшего кода: Modern Web Guidance

Избавляем ИИ от устаревшего кода: Modern Web Guidance

Chrome, Edge, Firefox и MDN помогают ИИ-агентам писать современный, быстрый и безопасный код для веба.

ИИ-агенты умеют создавать сайты и веб-приложения, но нередко используют устаревшие JavaScript-решения там, где современные браузеры уже предлагают встроенные возможности HTML и CSS. Команда Google Chrome совместно с разработчиками Microsoft Edge, Mozilla Firefox, MDN и веб-сообществом развивает Modern Web Guidance — открытый набор инструкций для ИИ-агентов. Разбираемся, как он работает, какие проблемы решает, как помогает модернизировать существующие проекты и каким образом подключить его к Codex, Claude Code, GitHub Copilot и другим инструментам.

Modern Web Guidance AI Skills ИИ-агенты Claude Code Codex

Почему искусственный интеллект продолжает писать устаревший код

Искусственный интеллект заметно изменил процесс веб-разработки. Сегодня с помощью ИИ-агентов можно создавать интерфейсы, разрабатывать компоненты, исправлять ошибки, писать тесты и анализировать существующие проекты.

Но у такого подхода есть проблема, с которой сталкиваются даже опытные разработчики.

ИИ способен написать полностью рабочий код, который при этом будет избыточным, недостаточно эффективным или основанным на устаревших подходах.

Например, для реализации обычного модального окна агент может создать собственную систему управления состоянием, блокировкой прокрутки, обработкой клавиатуры и фокусом.

А для адаптивного компонента — написать JavaScript, отслеживающий изменение ширины окна браузера.

При этом современные браузеры уже содержат инструменты, позволяющие решать многие подобные задачи проще.

Почему ИИ не всегда использует их?

Одна из причин заключается в особенностях обучающих данных.

Языковые модели обучались на огромных объёмах программного кода, документации и технических материалов, созданных в разные годы.

Среди этих данных много примеров, написанных задолго до появления современных браузерных API.

В результате агент может воспроизводить знакомые шаблоны, даже если сегодня существуют более подходящие решения.

И проблема не обязательно в том, что модель ничего не знает о новых технологиях.

Иногда она знает о существовании API, но не располагает достаточным количеством качественных примеров его применения в реальных проектах.

Именно эту проблему призван решать Modern Web Guidance.

Что такое Modern Web Guidance

Modern Web Guidance — открытый набор специализированных инструкций и рекомендаций для ИИ-агентов, занимающихся разработкой сайтов и веб-приложений.

Проект помогает агентам выбирать современные возможности браузеров, учитывать совместимость, производительность, доступность и безопасность.

10 ноября 2026 года Google Chrome объявила о выпуске стабильной версии Modern Web Guidance 1.0.

Ранее проект был представлен в предварительном виде на Google I/O, а к развитию версии 1.0 присоединились команды Microsoft Edge и Mozilla Firefox.

В репозитории также указано участие MDN и сообщества веб-разработчиков.

Кто разрабатывает проект

Modern Web Guidance поддерживается специалистами, связанными с развитием современной веб-платформы:

  • Google Chrome;

  • Microsoft Edge;

  • Mozilla Firefox;

  • MDN;

  • независимыми экспертами по веб-стандартам и доступности;

  • участниками открытого сообщества.

Это важная особенность проекта.

Рекомендации формируются не только на основе популярных примеров из интернета, но и с участием специалистов, которые работают с браузерными технологиями и веб-стандартами.

В версии 1.0 разработчики также усилили экспертную проверку инструкций, включая отдельную проверку рекомендаций по доступности интерфейсов.

Это библиотека или плагин?

Modern Web Guidance не является обычной JavaScript-библиотекой, которую необходимо подключать к сайту.

Он не добавляет клиентский код на страницы и не требует менять архитектуру приложения только ради своего использования.

Это инструмент для процесса разработки.

Он предоставляет ИИ-агенту актуальные рекомендации, примеры и ограничения, необходимые для принятия технических решений.

Проще говоря, Modern Web Guidance помогает агенту понять, как лучше написать код, а не выполняет какую-либо функцию непосредственно на сайте посетителя.

Как работает Modern Web Guidance

В основе инструмента лежит сочетание специализированных инструкций, локального поиска и базы технических рекомендаций.

Работу можно разделить на три основных этапа.

1. Агент определяет задачу

Представим, что разработчик просит Codex:

«Создай модальное окно с плавным появлением, поддержкой клавиатуры и корректным управлением фокусом».

Агент определяет, что задача связана с модальными интерфейсами, анимацией и доступностью.

2. Выполняется поиск подходящих рекомендаций

Modern Web Guidance предоставляет команду поиска:

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

Инструмент подбирает подходящие руководства из собственной базы.

Для поиска используются локальные механизмы, включая семантический поиск и BM25.

Согласно документации, поиск может выполняться без отправки содержимого проекта во внешнюю модель.

3. Агент получает конкретную инструкцию

После нахождения подходящего руководства его можно получить по идентификатору:

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

Результат содержит рекомендации по реализации, примеры кода, особенности использования и возможные ограничения.

Агент может применить эти сведения при выполнении задачи.

Почему это эффективнее огромной инструкции

Можно было бы попытаться добавить в системный промпт ИИ сотни правил современной веб-разработки.

Но такой подход быстро становится неудобным.

Большая инструкция занимает контекст, содержит множество не относящихся к текущей задаче сведений и со временем устаревает.

Modern Web Guidance использует другой принцип: предоставлять агенту конкретные знания тогда, когда они действительно нужны.

Это позволяет не перегружать контекст ненужной документацией.

Устаревший код

Что изменилось в Modern Web Guidance 1.0

Стабильная версия 1.0 получила несколько важных улучшений.

Анализ существующего кода

Появился отдельный процесс модернизации проекта.

Инструмент помогает обнаруживать известные устаревшие шаблоны в HTML, CSS, JavaScript и файле package.json.

Это позволяет использовать Modern Web Guidance не только при создании новых компонентов, но и при работе с уже существующими сайтами.

Расширенная база рекомендаций

Проект охватывает сотни современных возможностей веб-платформы и практических сценариев.

Рекомендации ориентированы на те задачи, в которых ИИ-агенты действительно допускают ошибки или выбирают неудачные подходы.

Проверка экспертами

Разработчики усилили процесс проверки руководств.

Особое внимание уделяется доступности, безопасности и совместимости между браузерами.

Открытая система тестирования

Для проверки эффективности используются автоматизированные тесты, сравнивающие работу ИИ-агентов с Modern Web Guidance и без него.

Результаты публикуются в открытой панели оценки.

Это позволяет оценивать проект не только по описанию возможностей, но и по результатам тестирования.

Какие проблемы Modern Web Guidance помогает решать

Возможности инструмента охватывают несколько направлений веб-разработки.

Направление Примеры задач
HTML Диалоги, формы, нативные элементы интерфейса
CSS Container Queries, Grid, Subgrid, анимации
JavaScript Современные браузерные API, управление задачами
Производительность LCP, INP, приоритет загрузки ресурсов
Доступность Клавиатура, фокус, экранные дикторы
Безопасность CSP, Trusted Types, обработка HTML
UX Переходы, всплывающие элементы, взаимодействия
Совместимость Поддержка возможностей в разных браузерах

Рассмотрим наиболее интересные направления.

Современный HTML вместо избыточного JavaScript

Одна из главных идей Modern Web Guidance — использовать встроенные возможности браузера там, где это действительно оправданно.

Например, для модальных окон существует элемент <dialog>.

Он поддерживает нативное поведение модального интерфейса при использовании showModal().

Пример модального окна

<dialog id="contact-dialog">
    <h2>Связаться с нами</h2>

    <p>Оставьте заявку для консультации.</p>

    <form method="dialog">
        <button type="submit">
            Закрыть
        </button>
    </form>
</dialog>

<button
    type="button"
    id="open-dialog"
>
    Открыть форму
</button>

<script>
    const dialog = document.querySelector(
        '#contact-dialog'
    );

    document.querySelector(
        '#open-dialog'
    ).addEventListener('click', () => {
        dialog.showModal();
    });
</script>

Это упрощённый демонстрационный пример.

Для полноценного интерфейса необходимо дополнительно продумать подписи, структуру формы, анимации и сценарии взаимодействия.

Но сам браузер уже предоставляет важные механизмы модального поведения.

В старых реализациях многие из этих возможностей приходилось создавать вручную.

Почему это важно

Меньше собственного кода — потенциально меньше ошибок и затрат на поддержку.

Однако не следует считать, что любой нативный компонент автоматически решает все вопросы доступности и пользовательского опыта.

Корректная структура HTML и тестирование по-прежнему необходимы.

Современный CSS вместо JavaScript для адаптивности

Ещё один характерный пример — адаптивные компоненты.

Раньше разработчики часто использовали JavaScript для отслеживания ширины браузера и изменения оформления элементов.

Сегодня для многих подобных задач существуют Container Queries.

Пример

.product-container {
    container-type: inline-size;
}

.product-card {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

@container (min-width: 600px) {
    .product-card {
        grid-template-columns: 200px 1fr;
    }
}

В данном случае оформление карточки зависит от ширины её контейнера, а не от общей ширины окна браузера.

Это удобно для компонентов, которые могут использоваться в разных частях сайта.

Например, карточка товара может располагаться в широкой основной области или узкой боковой колонке.

И в каждом случае самостоятельно адаптироваться к доступному пространству.

Какие ещё возможности CSS рассматриваются

Modern Web Guidance содержит рекомендации по использованию:

  • CSS Grid и Subgrid;

  • Container Queries;

  • CSS Nesting;

  • Cascade Layers;

  • современных цветовых пространств, включая OKLCH;

  • CSS Anchor Positioning;

  • современных возможностей анимации;

  • адаптивной типографики;

  • CSS View Transitions.

Важно понимать, что не все перечисленные возможности имеют одинаковую поддержку браузерами.

Поэтому выбор конкретной технологии должен зависеть от требований проекта.

Анимации без громоздких библиотек

Анимации — ещё одна область, где ИИ нередко предлагает избыточные решения.

Например, для простого появления элемента агент может подключить дополнительную JavaScript-библиотеку.

Хотя в ряде случаев достаточно современных возможностей CSS.

Modern Web Guidance содержит рекомендации по анимации диалогов, всплывающих элементов, переходов между состояниями и страницами.

View Transitions API

View Transitions API позволяет создавать визуальные переходы между состояниями интерфейса.

Он может использоваться для улучшения навигации и изменения содержимого.

Однако реализация зависит от типа приложения и поддержки браузера.

Анимации и доступность

При создании анимаций необходимо учитывать пользователей, предпочитающих уменьшенное количество движения.

Для этого существует медиазапрос:

@media (prefers-reduced-motion: reduce) {
    .animated-element {
        animation: none;
        transition: none;
    }
}

Это один из возможных вариантов реализации.

В некоторых интерфейсах правильнее не полностью отключать движение, а уменьшать его интенсивность.

Modern Web Guidance помогает учитывать такие нюансы при разработке.

Производительность: меньше лишней работы браузера

Современная веб-разработка — это не только визуальное оформление.

Скорость загрузки и отзывчивость интерфейса напрямую влияют на удобство использования сайта.

Modern Web Guidance включает рекомендации по оптимизации производительности.

Interaction to Next Paint

INP показывает, насколько быстро интерфейс реагирует на действия пользователя.

Одной из причин плохого INP могут быть длительные JavaScript-задачи, блокирующие основной поток браузера.

Modern Web Guidance содержит рекомендации по разделению таких задач и использованию механизмов планирования, включая scheduler.yield() там, где он поддерживается.

Оптимизация изображений

Инструмент также помогает правильно выбирать приоритет загрузки изображений.

Например, изображение первого экрана, являющееся LCP-кандидатом, обычно должно загружаться с высоким приоритетом.

А изображения, находящиеся далеко ниже видимой области, можно загружать отложенно.

Предварительная загрузка страниц

Современные браузеры поддерживают механизмы предварительной загрузки и подготовки переходов.

При правильном использовании они могут улучшить ощущаемую скорость навигации.

Но агрессивная предварительная загрузка способна создавать ненужный сетевой трафик.

Поэтому важно учитывать реальные сценарии использования сайта.

Безопасность: современные подходы вместо опасных шаблонов

Вопрос безопасности особенно важен при использовании ИИ для генерации кода.

Рабочий на первый взгляд JavaScript может содержать уязвимости.

Например, небезопасную вставку пользовательского HTML.

Опасный пример

container.innerHTML = userInput;

Если userInput содержит недоверенные данные, такая операция может создать риск XSS.

Более безопасный вариант для обычного текста

container.textContent = userInput;

Если задача заключается в выводе обычного текста, использование textContent позволяет избежать интерпретации содержимого как HTML.

Если необходимо отображать разрешённую HTML-разметку, требуется отдельная безопасная обработка данных.

Modern Web Guidance содержит рекомендации по:

  • безопасной обработке недоверенного HTML;

  • Trusted Types;

  • Content Security Policy;

  • проверке источников сообщений;

  • безопасности сторонних ресурсов;

  • современной аутентификации;

  • защите пользовательских данных.

При этом инструмент не заменяет полноценный аудит безопасности.

Он помогает выбирать более безопасные подходы, но не гарантирует отсутствие уязвимостей.

Как установить Modern Web Guidance

Один из плюсов проекта — поддержка популярных ИИ-инструментов.

Для установки требуется рабочее окружение Node.js с доступными node, npm и npx.

Универсальный способ установки

Откройте терминал в каталоге проекта и выполните:

npx modern-web-guidance@latest install

Запустится интерактивный мастер установки.

Он поможет подключить Modern Web Guidance к поддерживаемому агенту.

Это основной способ, который рекомендуют разработчики проекта.

Установка через Skills CLI

Также можно использовать:

npx skills add GoogleChrome/modern-web-guidance

Этот вариант удобен при работе с инструментами, поддерживающими распространённый формат Agent Skills.

Установка в Codex

Для Codex предусмотрены команды подключения через систему плагинов:

codex plugin marketplace add GoogleChrome/modern-web-guidance

Затем:

codex plugin add modern-web-guidance@googlechrome

Доступность этого способа зависит от версии и конфигурации Codex.

При отсутствии соответствующих команд можно использовать универсальный установщик.

Установка в Claude Code

В Claude Code можно добавить репозиторий в marketplace:

/plugin marketplace add GoogleChrome/modern-web-guidance

После этого установить плагин:

/plugin install modern-web-guidance@googlechrome

Для применения обновлений может потребоваться перезагрузка плагинов.

Установка в GitHub Copilot CLI

Для GitHub Copilot CLI предусмотрен аналогичный процесс:

/plugin marketplace add GoogleChrome/modern-web-guidance

Затем:

/plugin install modern-web-guidance@googlechrome

Другие поддерживаемые инструменты

В документации также представлены варианты подключения к Cursor, Google Antigravity, WebStorm, Kimi Code и другим средам.

Список поддерживаемых интеграций развивается, поэтому актуальные команды лучше проверять в официальном README.

Как найти устаревший код в существующем проекте

Одна из наиболее интересных возможностей Modern Web Guidance 1.0 — анализ существующей кодовой базы.

Для этого предусмотрена команда:

npx modern-web-guidance@latest legacy-scan .

Точка в конце означает текущий каталог.

Инструмент выполняет анализ известных устаревших шаблонов и помогает определить возможности модернизации.

Что проверяется

Согласно документации, процесс модернизации работает с:

  • HTML;

  • CSS;

  • JavaScript;

  • package.json.

Он может выявлять определённые устаревшие подходы, ненужные зависимости и случаи, где стоит рассмотреть современные браузерные возможности.

Важное ограничение

В первой стабильной версии анализ основан на статических правилах и охватывает ограниченный набор шаблонов.

Это означает, что инструмент не способен автоматически обнаружить абсолютно все проблемы проекта.

Также сам факт обнаружения старого подхода не означает, что его необходимо немедленно заменить.

Нужно учитывать совместимость, требования бизнеса и существующую архитектуру.

Модернизация через ИИ-агента

В поддерживаемом агентском окружении можно использовать запрос:

/modern-web-guidance Modernize the code in this directory

Агент получает возможность использовать процесс модернизации и рекомендации Modern Web Guidance.

Однако проверка и применение изменений зависят от возможностей и разрешений конкретного агента.

Важно: Modern Web Guidance не следует воспринимать как инструмент, который одной командой гарантированно исправит весь устаревший код без участия разработчика.

Практический сценарий: модернизируем существующий сайт

Представим, что есть сайт, который разрабатывался несколько лет назад.

В нём используются собственные модальные окна, старые JavaScript-обработчики, дополнительные библиотеки для анимаций и сложные CSS-правила.

Я бы организовал модернизацию следующим образом.

Шаг 1. Сохранить текущее состояние

Перед изменениями необходимо зафиксировать рабочую версию проекта в Git.

Например, создать отдельную ветку:

git switch -c refactor/modern-web

Это позволит изучить изменения и при необходимости вернуться к предыдущему состоянию.

Шаг 2. Выполнить анализ

npx modern-web-guidance@latest legacy-scan .

Полученные рекомендации нужно изучить.

Шаг 3. Определить приоритеты

Не стоит пытаться модернизировать весь проект за один раз.

Лучше начать с компонентов, где изменения принесут наибольшую пользу.

Например:

  • модальные окна;

  • формы;

  • адаптивные компоненты;

  • тяжёлые JavaScript-обработчики;

  • анимации;

  • потенциально опасные операции с HTML.

Шаг 4. Передать задачу агенту

Пример запроса для Codex или Claude Code:

Проанализируй проект с помощью Modern Web Guidance.

Найди устаревшие решения в HTML, CSS и JavaScript.

Составь отчёт:
1. Какой код рекомендуется изменить.
2. Почему существующий подход нежелателен.
3. Какой современный API можно использовать.
4. Поддерживается ли он целевыми браузерами.
5. Какие существуют риски совместимости.
6. Какие тесты потребуются.

Пока не изменяй файлы проекта.

Такой подход позволяет сначала получить план и только затем приступать к изменениям.

Шаг 5. Модернизировать поэтапно

После согласования плана можно разрешить агенту изменять отдельные компоненты.

Я рекомендую избегать масштабных несвязанных изменений в одном коммите.

Так проще проверять результат и находить причины возможных ошибок.

Шаг 6. Проверить работу

После модернизации необходимо проверить:

  • отображение страниц;

  • работу интерфейса;

  • адаптивность;

  • клавиатурную навигацию;

  • ошибки JavaScript;

  • поддержку целевых браузеров;

  • производительность;

  • автоматические тесты.

Только после этого изменения стоит объединять с основной веткой.

Совместимость браузеров: почему не всегда нужен самый новый API

Одна из сильных сторон Modern Web Guidance — использование данных о совместимости браузеров.

Для этого проект опирается на сведения Baseline.

Что такое Baseline

Baseline помогает разработчикам понимать, насколько широко определённая веб-возможность поддерживается современными браузерами.

Это полезно при выборе новых CSS-свойств и JavaScript API.

Например, технология может быть доступна в последней версии Chrome, но ещё не иметь необходимой поддержки в других браузерах.

В таком случае её использование без дополнительной проверки может создать проблемы для части посетителей.

Прогрессивное улучшение

Один из рекомендуемых подходов — Progressive Enhancement.

Сначала создаётся базовая работоспособная версия интерфейса.

Затем для браузеров, поддерживающих новые возможности, добавляются улучшения.

Это позволяет использовать современные технологии, не лишая пользователей основной функциональности.

Нужны ли полифиллы?

Иногда да.

Но подключать крупную библиотеку ради одной небольшой функции не всегда оправданно.

Modern Web Guidance рекомендует оценивать необходимость полифиллов и выбирать лёгкие альтернативы, когда это возможно.

Главная идея — не отказываться от совместимости ради современности.

Насколько Modern Web Guidance действительно улучшает код ИИ

Разработчики проекта не ограничились описанием возможностей.

Для проверки эффективности они создали систему автоматизированных тестов.

В ходе оценки агентам предлагают выполнить задачи без Modern Web Guidance и с подключёнными рекомендациями.

Результаты проверяются с помощью тестов, в том числе браузерных проверок Playwright.

Что показывают результаты

В опубликованных разработчиками испытаниях наблюдается заметное увеличение доли успешно выполненных требований.

Например, в одном из тестовых наборов от 8 ноября 2026 года для Codex CLI показатель увеличился с 54% до 82%.

Это рост на 28 процентных пунктов.

В других наборах и с другими агентами результаты отличаются.

Важно правильно интерпретировать эти данные.

Это показатели выполнения требований в конкретной системе тестирования, а не доказательство того, что любой сайт станет на 28% быстрее или что качество всего кода улучшится на такой же процент.

Результаты демонстрируют пользу специализированных рекомендаций для определённых задач, но не заменяют тестирование реального проекта.

Modern Web Guidance и Chrome DevTools: почему их лучше использовать вместе

Разработчики рекомендуют сочетать Modern Web Guidance с инструментами Chrome DevTools для ИИ-агентов.

У этих решений разные задачи.

Modern Web Guidance помогает выбрать правильный технический подход.

Chrome DevTools позволяет исследовать поведение сайта в браузере и проверять фактические результаты.

Например, Modern Web Guidance может предложить разделить тяжёлую JavaScript-задачу на небольшие части.

Но только по рекомендации нельзя определить, насколько это улучшит отзывчивость интерфейса.

Для этого необходимо выполнить измерения.

Аналогично с анимациями.

Агент может получить рекомендации по правильной реализации переходов, но результат нужно проверить в реальном браузере.

Такой подход объединяет два важных этапа: принятие технического решения и проверку его эффективности.

Где Modern Web Guidance особенно полезен

Я вижу несколько практических сценариев применения.

Разработка новых сайтов

Инструмент помогает агенту сразу использовать современные подходы к HTML, CSS и JavaScript.

Это снижает вероятность появления избыточных решений, которые затем придётся перерабатывать.

Модернизация существующих проектов

Можно анализировать старые компоненты и постепенно заменять неактуальные подходы.

Особенно полезно для сайтов, которые поддерживаются несколько лет.

Frontend-разработка

Modern Web Guidance подходит для задач адаптивной вёрстки, создания интерфейсных компонентов, анимаций и работы с браузерными API.

React и другие JavaScript-приложения

Хотя инструмент ориентирован на веб-платформу, его рекомендации могут быть полезны и при разработке приложений на React, Vue и других технологиях.

Однако необходимо учитывать архитектуру используемого фреймворка.

Нативный браузерный API не всегда следует подключать напрямую в обход механизмов управления состоянием и жизненным циклом компонентов.

WordPress

Для WordPress Modern Web Guidance особенно интересен при разработке собственных тем, Gutenberg-блоков и frontend-части плагинов.

Например, он может помочь улучшить CSS, JavaScript, формы и интерфейсные компоненты.

Но важно понимать границы его возможностей.

Это не специализированный инструмент для аудита PHP, SQL-запросов, WordPress Hooks или архитектуры WooCommerce.

Его основная специализация — современные веб-технологии, работающие в браузере.

Может ли Modern Web Guidance заменить опытного разработчика?

Нет.

Инструмент помогает ИИ использовать более актуальные знания, но не принимает на себя ответственность за архитектуру и качество продукта.

Даже современные рекомендации необходимо оценивать в контексте конкретного проекта.

Например, переход на новый браузерный API может быть технически правильным, но не соответствовать требованиям совместимости.

Или новая реализация интерфейса может оказаться проще, но нарушить существующие пользовательские сценарии.

Поэтому разработчику необходимо контролировать:

  • соответствие требованиям;

  • совместимость;

  • безопасность;

  • доступность;

  • производительность;

  • качество изменений;

  • результаты тестирования.

Modern Web Guidance полезен именно как дополнительный источник экспертных рекомендаций.

Вопрос конфиденциальности и телеметрии

В документации указано, что поиск руководств может выполняться локально, без передачи исходного кода проекта в сторонний сервис.

При этом необходимо учитывать отдельный механизм телеметрии.

Разработчики сообщают о сборе анонимных технических данных, включая сведения об установках, используемом агенте, идентификаторах полученных руководств и поисковых запросах, сформированных агентом.

Согласно описанию проекта, исходные пользовательские запросы целиком не собираются.

Для отключения телеметрии предусмотрена переменная окружения:

DISABLE_TELEMETRY=1

Например, в PowerShell для текущего процесса можно использовать:

$env:DISABLE_TELEMETRY="1"

При работе с коммерческими проектами я рекомендую отдельно учитывать настройки самого ИИ-агента.

Даже если Modern Web Guidance выполняет поиск локально, подключённый агент может использовать облачную модель и передавать ей части кода в соответствии со своими настройками.

Мой взгляд на Modern Web Guidance

В своей работе над сайтами и веб-приложениями я всё чаще использую ИИ как инструмент, который помогает ускорять разработку, анализировать код и решать технические задачи.

Но я считаю важным не только то, насколько быстро агент создаёт результат.

Гораздо важнее, насколько качественным, поддерживаемым и понятным окажется этот результат через несколько месяцев.

Можно попросить ИИ написать модальное окно, адаптивный компонент или сложную анимацию.

С большой вероятностью он предложит рабочее решение.

Но это ещё не означает, что выбран наиболее подходящий способ реализации.

Именно поэтому Modern Web Guidance кажется мне полезным направлением развития инструментов для разработчиков.

Вместо попытки заставить ИИ помнить все особенности современных браузеров проект предоставляет ему актуальные технические рекомендации в момент выполнения задачи.

Особенно интересен подход, при котором предпочтение отдаётся возможностям самой веб-платформы, если они способны решить задачу без лишних зависимостей.

Для меня это соответствует одному из основных принципов качественной frontend-разработки: не усложнять код там, где браузер уже предоставляет необходимый функционал.

При этом я не стал бы автоматически переписывать все старые компоненты только потому, что появился новый API.

Любая модернизация должна иметь понятную цель и проверяемый результат.

Заключение

Modern Web Guidance — интересный пример того, как развивается экосистема ИИ-инструментов для программирования.

Если раньше основное внимание уделялось способности агента самостоятельно писать код, то теперь всё большее значение приобретает качество знаний, которыми он руководствуется.

Проект объединяет рекомендации по современным HTML, CSS, JavaScript, производительности, безопасности и доступности.

Он помогает агентам находить более подходящие технические решения, учитывать совместимость браузеров и анализировать существующий код на предмет возможной модернизации.

Особенно важно, что разработка ведётся при участии команд браузеров и специалистов по веб-стандартам.

Но использовать Modern Web Guidance стоит не как автоматическую кнопку исправления всего устаревшего кода, а как инструмент повышения качества разработки.

Хороший ИИ-агент должен не просто создавать работающий код, а выбирать решения, которые соответствуют возможностям современной веб-платформы и требованиям конкретного проекта.

И Modern Web Guidance делает ещё один шаг в этом направлении.