ChatGPT Atlas не нужен: Пишем свой AI-«браузер» который не стыдно запустить

Снова здравствуйте, уважаемые хабровчане.

Почти каждый день в ленте я вижу новости про очередного "революционного" AI-агента. AutoGPT, BabyAGI, Devin, Cursor, Perplexity, Atlas, Windsurf, Antigravity.... мол они заменят программистов, браузеры, людей, машины, а в итоге.... даже говорить не хочется

Я, как человек простой, хотел бы инструмент, который просто работает, мол "Зайди в гугл, найди доку, скажи мне ответ".
Я скачал пару ( два ) популярных решений ( все они на питухоне ) . И началось: venv, uv, конфликты, абстракции над абстракциями, и ужасная скорость

Ну вот так, ради интереса - я решил написать свой AI-"браузер" , но:

1. Никакого Python ( ничего личного просто бизнес )

2. Никакого LangChain

3. Никакой оплаты (я нищук)

Так родился Traw.

Акт 1. Почему современные агенты - это bloatware

Большинство современных AI-фреймворков - это...

• LangChain / LangGraph: Чтобы сделать простой цикл "Подумай -> Кликни", вам нужно продраться через графы, чейны и проприетарный синтаксис....

• Vision-based агенты: Они делают скриншот страницы на каждый шаг, Это медленно, дорого и бессмысленно для 90% задач ( на рандом циферка )

• Python: без слов

Мне нужно было что-то, что работает по принципу Plug||Play. Скачал и запустил. Поэтому выбор пал на Bun ( быстрый и относительно легкий )

Акт 2. Архитектура

Идея проста: Агент - это не магия. Это просто цикл While(!Done).

Вместо того чтобы скармливать нейронке скриншоты (как делают богатые) или сырой HTML , я выбрал фильтрацию DOM

Внутри это работает как старый добрый Vimium <3 Скрипт пробегает по странице, находит все интерактивные элементы (кнопки, инпуты, ссылки) и вешает на них индексы

// Упрощенная логика из src/browser/controller.ts document.querySelectorAll(selector).forEach((el) => { // ... логика фильтрации скрытых элементов const tag = el.tagName.toLowerCase(); items.push(`[${i}] <${tag}>${text}</${tag}>`); });

В итоге нейронка видит не матрицу пикселей, а чистый, понятный список:

[1] <input type="text">Search...</input> [2] <button>Google Search</button> [3] <a>How to center a div</a>

Это в 10-50 раз дешевле по токенам, чем Vision, и работает мгновенно и легче для AI

Акт 3. Мозги и... немного реверс-инжиниринга

Агент без модели - это просто скрипт Playwright. Нам нужна LLM. Но платить $20/мес за API, чтобы потестить пет-проект? повторяю я нищук

В проекте используется модуль mo (мой отдельный проект), который... "оптимизирует" доступ к моделям GLM

В коде агента это выглядит максимально тупо (и просто). Никаких адаптеров. Просто JSON тудон, JSON судон:

// src/agent/agent.ts const response = await this.mo.chat([ { role: "system", content: systemPrompt }, { role: "user", content: stateText } ]);

Если модель возвращает {"action": "click", "index": 5}, мы кликаем по 5-му элементу - Все

Акт 4. Эстетика в терминале (аххаха я написал свой Markdown-парсер)

Я ненавижу уродливые логи НО тащить жирный marked или что хуже markdown-cli ради вывода в консоль.... ну у нас тут не node а bun

Поэтому я сделал то, что лучше бы не стоило делать.... написал свой микро-парсер Markdown (markdownly.js).

Зачем? Чтобы вывод в терминале выглядел вот так:

Да, это велосипед

Акт 5. Traw в действии

Что мы имеем в сухом остатке?

1. Установка: bun install (или один бинарник)

2. Запуск: traw run "кто такой zarazaex69" # йа

3. Результат: Агент сам идет в DuckDuckGo, парсит выдачу, ходит по ссылкам и возвращает итог

Итоги

Traw - это игрушка. Но это показывает, что:

1. Сложность современных AI-агентов искусственна. Вам не нужны гигабайты либ, чтобы заставить браузер кликать кнопки ( вау )

2. Bun идеально подходит для CLI. Быстрый старт, встроенный TypeScript, компиляция в бинарник ( хотя думаю все знали )

Исходники как всегда открыты, Бинарники собраны - Пользуйтесь

GitHub: github.com/zarazaex69/traw