Show HN: Magnitude – 오픈소스 AI 브라우저 자동화 프레임워크

HN 여러분, Anders와 Tom입니다. 2개월 전에 저희 AI 테스트 자동화 프레임워크에 대한 글을 올렸는데 ( https://news.ycombinator.com/item?id=43796003 ) 꽤 좋은 반응을 얻었습니다. 커뮤니티에서 훌륭한 피드백을 많이 받았고, 가장 긍정적인 반응은 저희 브라우저 에이전트에서 사용하는 vision-first 접근 방식에 대한 것이었습니다. 하지만 많은 분들이 기반이 되는 에이전트를 테스트 영역 밖에서도 사용하고 싶어 하셨습니다. 그래서 오늘, 완전한 기능을 갖춘 AI 브라우저 자동화 프레임워크를 출시합니다. 웹에서 작업을 자동화하거나, API 없이 앱 간을 연동하거나, 데이터를 추출하거나, 웹 앱을 테스트하거나, 여러분만의 브라우저 에이전트를 만들기 위한 빌딩 블록으로 사용할 수 있습니다. 전통적으로 브라우저 자동화는 DOM을 통해서만 가능했지만, 그것은 인간이 브라우저를 사용하는 방식이 아닙니다. 대부분의 브라우저 에이전트는 여전히 이 패러다임에 갇혀 있습니다. vision-first 접근 방식을 통해 우리는 불안정한 DOM 탐색에 의존하지 않고, 다양한 사이트에서 발견되는 복잡한 상호작용에서 더 나은 성능을 발휘합니다. 예를 들면: - 드래그 앤 드롭 상호작용 - 데이터 시각화, 차트, 표 - 중첩된 iframe이 있는 레거시 앱 - Canvas와 webGL을 많이 사용하는 사이트 (디자인 도구나 사진 편집 등) - 브라우저로 스트리밍되는 원격 데스크톱 브라우저와 정확하게 상호작용하기 위해, 우리는 픽셀 좌표를 기반으로 정밀한 동작을 실행하는 시각적으로 그라운딩된(visually grounded) 모델을 사용합니다. Magnitude가 사용하는 모델은 행동을 계획할 만큼 똑똑해야 하면서 동시에 그것을 실행할 수 있어야 합니다. 똑똑하면서 *동시에* 시각적으로 그라운딩된 모델은 많지 않습니다. 최고의 성능을 위해 Claude Sonnet 4를 강력히 추천하지만, 오픈 소스를 선호하신다면 Qwen-2.5-VL 72B도 지원합니다. 대부분의 브라우저 에이전트는 프로덕션에 도달하지 못합니다. 그 이유는 (1) 위에서 언급한 불안정한 DOM 탐색 때문이기도 하고, (2) 대부분의 브라우저 에이전트가 제공하는 제어력 부족 때문이기도 합니다. 지배적인 패러다임은 에이전트에게 고수준 작업 + 도구를 주고 잘 되기를 바라는 것입니다. 이는 신뢰성과 구체성이 필요한 프로덕션 자동화에서는 빠르게 무너집니다. Magnitude를 사용하면 `act()`와 `extract()` 문법으로 에이전트를 세밀하게 제어할 수 있고, 필요에 따라 여러분의 코드와 섞어 쓸 수 있습니다. 또한 액션 수준과 에이전트 수준 모두에서 프롬프트를 완전히 제어할 수 있습니다. ```ts // Magnitude는 고수준 작업을 처리할 수 있습니다 await agent.act('Create an issue', { // 선택적으로 에이전트가 적절한 곳에서 사용할 데이터를 전달할 수 있습니다 data: { title: 'Use Magnitude', description: 'Run "npx create-magnitude-app" and follow the instructions', }, }); // 저수준 액션도 처리할 수 있습니다 await agent.act('Drag "Use Magnitude" to the top of the in progress column'); // 제공된 zod 스키마와 일치하는 DOM 콘텐츠를 기반으로 지능적으로 데이터를 추출합니다 const tasks = await agent.extract( 'List in progress issues', z.array(z.object({ title: z.string(), description: z.string(), // 에이전트는 기존 데이터나 새로운 인사이트를 추출할 수 있습니다 difficulty: z.number().describe('Rate the difficulty between 1-5') })), ); ``` 예제로 시작하는 것을 간단하게 만들어 주는 설정 스크립트가 있습니다. 그냥 "npx create-magnitude-app"을 실행하세요. 여러분의 생각을 듣고 싶습니다! Repo: https://github.com/magnitudedev/magnitude