WebMCP: контракт вместо угадайки
В первой части серии агент предстал отдельной персоной, против которой работают привычные UX-приёмы. Здесь речь о WebMCP — предложении, которое заменяет угадывание по пикселям контрактом между страницей и агентом.
Что сегодня делает агент в браузере
Максимилиано Фиртман в докладе «WebMCP: Making Web Apps Faster and Cheaper for Coding Agents» описывает текущий цикл агента одним словом — угадайка. Агент наблюдает за страницей по скриншоту, DOM или accessibility-дереву, выводит, куда кликнуть, действует и после каждого клика повторяет всё заново. Каждый шаг — новый инференс, потому что после клика состояние страницы неизвестно.
WebMCP убирает из этого цикла инференс. Вместо того чтобы модель догадывалась о возможностях страницы по пикселям, страница сама объявляет набор инструментов, который написал веб-разработчик. Формулировка Фиртмана: «мы переходим от инференса к контракту».
Анатомия инструмента
Инструмент — объект из четырёх частей:
| Часть | Что это |
|---|---|
| Имя | идентификатор, по которому агент выбирает инструмент |
| Описание | текст для модели, не для человека — что произойдёт при вызове |
| Input schema | аргументы со схемой и типами |
execute | обычная JavaScript-функция |
Императивный API выглядит как document.modelContext.registerTool({...}) — в подкасте Фиртман называет форму navigator.modelContext.registerTool, что само по себе неплохая иллюстрация зрелости спецификации.
Важная деталь: execute возвращает промис. Значит, внутри можно уйти куда угодно асинхронно — на бэкенд, в Bluetooth-устройство, в IndexedDB, к пользователю за подтверждением. Инструмент на странице — полноценная точка входа в приложение.
JavaScript при этом не обязателен. Есть декларативный вариант поверх обычных HTML-форм: на <form> вешаются атрибуты tool-name и tool-description (оба обязательные), булев tool-auto-submit — явное разрешение автора на автосабмит агентом, и tool-parameter-description на полях ввода, списках и textarea, если подписи модели недостаточно.
Отсюда же и главное ограничение применимости, которое Фиртман проговаривает сам: «нет форм на сайте — считай, нет юзкейса для WebMCP».
Ещё одно правило, которое легко пропустить: регистрировать все инструменты на загрузке не нужно и вредно. Набор инструментов должен меняться вместе с состоянием приложения — вошёл пользователь в аккаунт или вышел, какой шаг воронки, какой экран открыт. Инструменты снимаются и добавляются на лету.
Чем это отличается от обычного MCP
Фиртман настаивает, что это два разных слоя, каждый со своей задачей.
| MCP | WebMCP | |
|---|---|---|
| Что соединяет | агента с бэкендом: серверы, API, данные, рабочие процессы | агента с фронтендом: текущей страницей |
| Где живёт исполнитель | сервер | JavaScript-функция на странице |
| Транспорт | исторически HTTP с long-polling (веб-сокетов не было) и бинарный сокет для локальных клиентов | никакого — это просто JS в странице |
| Что доступно | то, что есть на бэкенде | позиция скролла, введённые в форму данные, UI-состояние, сессия, localStorage и IndexedDB, File System API, Web Serial, сенсоры |
Последняя строка — суть. WebMCP даёт агенту то, чего на бэкенде физически нет. Пример Фиртмана про сенсоры вполне буквальный: веб-приложение на смарт-очках Meta.
Его же сравнение, объясняющее степень родства: «WebMCP относится к MCP как JavaScript к Java» — вдохновлён идеей, но протокол совсем другой.
Из этого следует практический вывод, который обычно расстраивает команды: экспортировать существующий MCP-сервер в WebMCP нельзя. Общая только концепция: имя, описание на английском и схема. Транспорт разный, среда исполнения разная, писать придётся с нуля. И автоматически WebMCP на сайте не появится — нужно идти в свой JavaScript и реализовывать.
Ведущий подкаста AI Native Dev заметил на это любопытную вещь: в AI-мире идёт обратное движение — то, что раньше правильно было разделять, снова слепляют, отсюда и бум монорепо: агенту проще, когда всё в досягаемости. WebMCP делает то же самое с фронтендом: сознательно затаскивает API внутрь страницы, жертвуя чистотой разделения слоёв ради связности для агента. Если тебе от этой идеи неуютно — это нормальная реакция, и она честная.
Ключевой сюжет: почему «больше никаких скриншотов»
СО СЦЕНЫ: ПЯТЬ СЕКУНД, ЗА КОТОРЫЕ КНОПКА УЕЗЖАЕТ
- Кто и где: Максимилиано Фиртман, подкаст AI Native Dev, выпуск «No More Screenshots. Web MCP Lets Agents Talk to Your Website Directly»
- Что показали: Разбор цикла скриншот-агента по шагам. Агент делает снимок экрана, отдаёт его мультимодальной модели, получает координаты, кликает. Между снимком и кликом проходит время на анализ — 5–10 секунд. За это время JavaScript на странице вполне мог передвинуть кнопку: догрузился баннер, приехал ответ от API, отработала анимация. Клик уходит в пустоту, нужен новый скриншот, и цикл начинается заново.
- Цифры: окно рассинхрона — 5–10 секунд между снимком и кликом. Каждый повтор оплачивается токенами мультимодальной модели
- Что это меняет: За фразой «больше никаких скриншотов» стоит арифметика. Подход неэффективен и по времени, и по деньгам: изображения дороги в инференсе, а промах заставляет платить за них дважды и трижды. Прямая цитата Фиртмана: «что если за эти 5–10 секунд JavaScript передвинул кнопку?»
Естественный контраргумент — не надо скриншотов, читай DOM. Фиртман отвечает на него в том же выпуске, и ответ разобран в первой части серии: после эпохи React DOM несемантичен, это «список из сотни div'ов», а accessibility-дерево, которое выручает на нативном iOS, на вебе даёт заметно худший результат в тестах. Агенты возвращаются к скриншотам после того, как DOM-подход показал худший результат.
WebMCP закрывает эту дыру с другой стороны. Вызов инструмента — это вызов функции: детерминированный, с валидированными аргументами, без координат и без гонки с рендерингом. Одна операция вместо цикла, в котором за снимком следует инференс, за инференсом клик, а за кликом новый снимок.
Второй ключевой момент: сайт наконец узнаёт, что им управляет агент
Об этом говорят меньше, чем про скриншоты, но по последствиям для продуктовой команды это, возможно, важнее.
Сегодня обнаружить агента на сайте невозможно в принципе. Фиртман приводит пример: X пытается проверять «настоящий палец на экране» — и это не помогает, потому что Puppeteer и Playwright эмулируют касания. Сайт не может отличить человека от автоматики, если та не хочет представляться.
WebMCP добавляет на window события tool-activated и tool-cancel, а также CSS-псевдоклассы. То есть страница получает сигнал: сейчас тобой управляет агент, вот какой инструмент он активировал, вот момент, когда он отменился.
Что с этим можно делать:
- перестроить UI под машинного потребителя — убрать анимации, показать компактное состояние;
- честно показать живому пользователю, что за него сейчас действует агент, — если человек сидит перед тем же экраном;
- вести себя по-разному в одной и той же функции. Фиртман отдельно отмечает: функции можно переиспользовать с обычным UI, есть флаг, позволяющий проверить, кто сейчас вызвал — агент или человек.
К этому же примыкает механика прерывания. Если инструмент делает что-то платное или необратимое, разработчик может попросить браузер задать вопрос пользователю: агент ждёт, браузер показывает диалог «подтверждаете покупку билета?», ответ возвращается агенту. Принципиально важно, кто у кого спрашивает: платформа задаёт вопрос человеку, и агент ждёт ответа. Ограничение честное — работает только там, где человек реально сидит за видимым браузером.
Экономика
Считать тут особо нечего, но направление однозначное.
- Токены. Скриншот-цикл сжигает токены мультимодальной модели, и каждый промах умножает счёт. Вызов инструмента — текстовый и однократный.
- Время. 5–10 секунд на шаг против одного вызова функции.
- Стоимость промаха. У скриншот-подхода она нелинейная: промахнулся — заплатил ещё раз за весь цикл.
Ведущий подкаста связал это с общей чертой агентной разработки, которую в Tessl сформулировали как «сначала дёшево, потом дорого»: сначала кажется, что один человек делает объём команды, потом приходит счёт и начинается вопрос «а можно ли то же самое дешевле». Большинство команд до этой фазы ещё не дошло — они в discovery. WebMCP — один из ответов на вторую фазу, и продавать его внутрь компании проще именно там.
Есть и второй маршрут удешевления, о котором Фиртман говорит в том же выпуске: client-side AI. Chrome умеет по запросу первого же сайта скачать Gemini Nano (4–8 ГБ, три модели, качается нужная) и отдать его любому сайту через JS-API. Отдельно есть библиотеки поверх WebAssembly, WebGPU и WebNN, качающие открытые модели прямо в страницу: специализированные весят 200–500 МБ (модель детекции объектов от Apple — 200 МБ), Qwen 0.5B дообучается на обычной машине. Мотив прагматичный: боты поддержки первыми упираются в счёт за облачные токены, и часть нагрузки уносят на клиент. В примере докладчика счёт составлял $100 000. Оговорок две: по его оценке client-side AI используют меньше 1% компаний, и это «не для терапевта и не для преподавания истории» — область применения здесь суммаризация, категоризация, модерация и мини-RAG. Перевод контента, по его словам, проходит тесты качества на 25 языках.
Стоит ли вообще вкладываться во фронтенд под агентов — Фиртман отвечает на это своим прогнозом. Всё, что нагенерировано вайб-кодингом, — веб-приложения, значит, веба становится только больше. Его горизонт на три года: меньше нативных приложений на мобильных, больше вещей, к которым приходят по ссылке или QR-коду и которые уже никто не называет «веб-приложением» — просто «AI-приложением». Сам он, к слову, пишет 15-ю книгу за 30 лет в вебе — про vanilla web и принципиально без AI в процессе, — и аргументирует выбор темы ровно в ту же сторону: меньше библиотек и зависимостей безопаснее и лучше для контекста, агентным инструментам проще писать веб без тяжёлого дерева зависимостей.
Чего WebMCP не делает
Здесь важно не переобещать, иначе внедрение развалится о первую же реальность.
- Не отменяет старые техники. Агенты откатываются на скриншоты и DOM, если инструментов нет. WebMCP только добавляет быстрый путь.
- Не заменяет тесты. Фиртман прямо говорит: инструменты — это новый публичный контракт, который тоже надо покрывать юнит-тестами. По смыслу WebMCP ближе к юнит-тесту функции, чем к e2e. E2e-проверка смотрит на то, как всё выглядит и ведёт себя для человека, и никуда не денется.
- Не работает в headless. Только видимый Chrome. В Puppeteer доступно под экспериментальным флагом.
- Не поддерживается кодагентами нативно. Рабочая схема на сегодня: агент (Claude Code, Cursor, Codex — любой с MCP) подключается к Chrome DevTools MCP, тот поднимает живой экземпляр Chrome, открывает страницу, перечисляет её инструменты и вызывает их. Дальше ожидается прямая поддержка — Codex, MCP apps в ChatGPT, браузерный плагин OpenClaw.
- Не всем нужен. Сильнейшая мотивация — электронная коммерция: «вам всё равно, человек это или агент, вам нужны деньги от покупателя», а Apple Pay и Android Pay вообще работают только на клиенте, поэтому корзина живёт в браузере. Обратная картина у блогов и медиа: авторы агентов отталкивают — IP, пользователь не доходит до сайта, авторство теряется. Контентным сайтам WebMCP по большей части бессмысленен.
И главная оговорка — про статус. Стандарт предложен командой Chrome и целится в их же agent mode. Ни OpenAI (несмотря на спонсорство OpenClaw), ни Anthropic — авторы самого MCP — в обсуждении в W3C пока не участвуют: для них веб-стандарты новая территория. Пока это Chrome-only под флагом. Origin trial открылся в Chrome 149 — на следующий день после доклада. Формулировка Фиртмана: «это всё ещё эксперимент, спецификация обсуждается — что-то добавят, что-то выкинут».
Коротко
- WebMCP заменяет инференс контрактом: страница объявляет инструменты (имя, описание для модели, схема,
execute), агент их вызывает вместо угадывания по пикселям (Фиртман). - «Больше никаких скриншотов» — арифметика: 5–10 секунд между снимком и кликом хватает, чтобы JavaScript передвинул кнопку, и цикл начинается заново за твой счёт в токенах.
- Твой MCP-сервер в WebMCP не экспортируется: общая только концепция. Транспорт и среда исполнения разные, писать придётся заново, в своём JavaScript.
- Впервые появляется детект агента: события
tool-activatedиtool-cancelи CSS-псевдоклассы. Раньше такого сигнала не было в принципе — Puppeteer эмулирует даже касания. - Статус трезвый: Chrome-only, origin trial с Chrome 149, headless не поддержан, ни OpenAI, ни Anthropic в обсуждении стандарта нет.
Построим такой контур в вашей компании
coMind переводит команды и компании в AI-Native: первый контур за 30 дней, методика — в книгах серии «Путь компании к AI-Native».