Lightpanda: браузер весом 64 МБ, который в 60 раз БЫСТРЕЕ Chrome
BBetter Stack
Computing/SoftwareSmall Business/StartupsInternet Technology
Transcript
00:00:00Это LightPanda, безголовый браузер, разработанный специально для ИИ-агентов и написанный с нуля на языке Zig. В нем нет WebKit или Chromium, что делает его до девяти раз быстрее и потребляет в 16 раз меньше памяти, чем безголовый Chrome.
00:00:12Он даже поддерживает протокол Chrome Developer Protocol, поэтому его можно использовать с Puppeteer или Playwright, но он не отрисовывает пиксели и не поддерживает общие веб-API, такие как service workers, IndexedDB и CORS.
00:00:22Так почему же его используют в OpenClaw и браузере для агентов Cells? Подписывайтесь, и мы это выясним.
00:00:30LightPanda была выпущена примерно в 2024 году Пьером, Фрэнсисом и Кейт задолго до появления Claude Code, как раз в то время, когда ChatGPT начал набирать популярность.
00:00:41Изначально это был инструмент для веб-скрейпинга и автоматизации, но вскоре после резкого роста популярности ИИ-агентов они сфокусировались именно на них и даже получили раунд финансирования.
00:00:51Но был ли это просто быстрый ребрендинг на волне популярности ИИ, или он действительно хорош для агентов?
00:00:56Мы проверим это, создав собственного агента с помощью SDK Claude и инструмента WebFetch, а затем используем Chrome и LightPanda в качестве движков для веб-серфинга, чтобы сравнить их и понять, какой из них лучше и почему.
00:01:09Хотя у LightPanda есть сервер MCP и собственный облачный сервис, мы постараемся сделать всё максимально локально.
00:01:16И для начала мы рассмотрим простой пример использования LightPanda, прежде чем перейдем к созданию инструмента WebFetch.
00:01:22Вот скрипт, который по сути извлекает кучу ссылок из Википедии.
00:01:27Принцип работы заключается в том, что сначала создается сервер LightPanda, а затем к нему подключается Puppeteer.
00:01:32У нас есть код для замера времени выполнения процесса: он переходит в Википедию, проходит по всем ссылкам в разделе "Ссылки" и выводит их.
00:01:40Если хотите это представить, то раздел "Ссылки" находится здесь, на странице веб-браузера.
00:01:44И, как видите, первая ссылка в списке — это Device Atlas, она совпадает с той, что внизу.
00:01:50Итак, LightPanda нашла все ссылки за 344 миллисекунды.
00:01:53А если мы попробуем то же самое с Chrome, это займет 392 миллисекунды.
00:01:58Разница невелика, но ситуация кардинально меняется, когда нужно обработать много страниц.
00:02:04Вот похожий скрипт, но с одним важным отличием.
00:02:07Вместо получения ссылок с одной страницы Википедии мы берем сто.
00:02:11Если заглянуть в определение, можно увидеть все страницы, которые он будет запрашивать: HTTPS, JavaScript, Mongo, Python и многие другие.
00:02:19Если попробовать сделать это с LightPanda, всё выполняется за 18 секунд.
00:02:23А если попробовать то же самое в Chrome, это занимает около 30 секунд.
00:02:26А в некоторых случаях, когда я запускал этот тест, уходило до 60 секунд.
00:02:29Но давайте посмотрим, как изменится производительность, если запустить это через агента.
00:02:32Здесь у меня есть очень простой агент, использующий SDK Claude, и вот инструмент webfetch, который выполняет этот промпт.
00:02:39Он суммирует различия между ArrayMap, Filter и Reduce в JavaScript и переходит по указанным ссылкам на MDN, чтобы найти информацию о них.
00:02:48Ниже находится наш агентский цикл, и здесь, поскольку инструмент всего один, есть оператор if для проверки того, используется ли именно этот инструмент.
00:02:54Но если бы инструментов было больше, это было бы необходимо.
00:02:56А вот функция webfetch, которая вызывается при каждом вызове инструмента.
00:03:00Ниже мы добавили метрики и функцию для подсчета памяти браузера.
00:03:04Этот проект будет использовать LightPanda и Chrome через протокол Chrome DevTools.
00:03:09Мы запустим его на порту, а Puppeteer подключится к этому порту перед запуском агента.
00:03:14Мы можем запустить сервер с помощью "LightPanda serve", а затем запустить нашего агента, который получит три URL-адреса с MDN и передаст информацию Claude.
00:03:22И здесь он выдает нам ответ с объяснением разницы между Map, Filter и Reduce, а также возвращает метрики.
00:03:29Теперь давайте попробуем то же самое с Chrome, стараясь избавиться от кэширования по умолчанию, так как LightPanda — не полноценный браузер и у него нет такого уровня кэширования, как у Chrome.
00:03:38Так что будет справедливо отключить его и в Chrome.
00:03:40Затем мы запустим то же самое в Chrome, который также загрузит URL с MDN и даст нам ответ от Claude.
00:03:46Но вот тут-то всё становится совсем иначе.
00:03:48Если сравнить результаты, LightPanda здесь, а Chrome здесь, оба делают по три запроса.
00:03:54Но видно, что время загрузки для LightPanda было намного меньше, почти в два раза быстрее, чем в Chrome.
00:03:59Общее время выполнения (wall time) одинаковое.
00:04:01Но посмотрите сюда: память браузера для LightPanda составляет всего 66 МБ, тогда как для Chrome — 829 МБ.
00:04:07Это более чем в 10 раз меньше у LightPanda; память агента тоже немного меньше, но движок браузера не слишком сильно влияет на это значение.
00:04:17Честно говоря, вам больше никогда не стоит использовать Chrome для headless-браузинга.
00:04:20В смысле, зачем? LightPanda до 21 раза меньше Chrome, работает быстрее и потребляет гораздо меньше памяти.
00:04:28Но есть один сценарий, в котором вы, возможно, захотите использовать Chrome вместо LightPanda.
00:04:33Если мы изменим промпт с вопроса по JavaScript на запрос пяти вариантов жилья на Airbnb в Токио, то при запуске в Chrome мы получим ожидаемые результаты.
00:04:42Но если попробовать то же самое с LightPanda, мы увидим, что она не может получить списки с Airbnb.
00:04:47Это происходит потому, что Airbnb — одностраничное приложение (SPA), а хотя у LightPanda есть движок V8 для выполнения JavaScript...
00:04:54Это работает только на уровне языка.
00:04:57То есть async/await, замыкания, промисы и тому подобное.
00:05:00Но с чем-то более сложным, вроде этого SPA от Airbnb, LightPanda испытывает трудности при отрисовке и получении всей нужной информации.
00:05:07Так что, помимо невозможности корректного рендеринга SPA, что они, возможно, исправят в будущем...
00:05:13LightPanda — отличный инструмент, который стоит добавить к своему кастомному агенту, если ему нужно выполнять веб-поиск или веб-запросы.
00:05:20И пока мы говорим о веб-серфинге с помощью агента: если вы когда-нибудь хотели, чтобы Claude Code безопасно управлял вашей реальной запущенной сессией Chrome...
00:05:27Со всеми вашими данными для входа и прочим, посмотрите это видео об удаленной отладке с помощью Chrome MCP-сервера.