배경

매일 우리는 브라우저에서 작업합니다. 정보를 검색하고, 웹 콘텐츠를 탐색하고, 주문을 하고, 스프레드시트를 정리하고, 양식을 작성하는 등.

한편으로, 우리는 수십 개에서 수백 개의 브라우저 탭을 열고, 탭 전환 및 관리가 불가능한 작업이 되었습니다. 많은 경우 처음부터 다시 시작하고, 눈앞의 탭에만 집중해야 합니다.

다른 한편으로, 많은 작업은 반복적이며, 양식 작성, 스프레드시트 정리, CAPTCHA 입력 등을 반복적으로 실행해야 합니다. 이 과정은 지루하고 비효율적입니다.

그렇다면 AI가 하면 어떨까요? 저는 이전에 탭을 정리하는 플러그인을 만들었고, 복잡한 탭을 그룹화하여 정리했습니다. Tool Call과 MCP의 발전으로 AI 에이전트가 할 수 있는 일이 점점 더 많아지고 있다는 것을 깨달았고, 이 플러그인은 곧 현재의 브라우저 확장 프로그램 AIPex가 되었습니다. AIPex는 자연어를 사용하여 브라우저를 제어하는 것을 지원하며, 컨텍스트 엔지니어링을 최적화한 후 빠르고 정확하게 작업을 완료할 수 있습니다.

이 기사를 통해 다음 질문에 답하고 싶습니다:

1. AI 브라우저가 미래의 트렌드인 이유는 무엇인가요?
2. AI 브라우저의 구현 경로는 무엇인가요? 각각의 장단점은 무엇인가요?
3. AIPex가 AI 브라우저 자동화의 게임 체인저라고 자신 있게 말할 수 있는 이유는 무엇인가요?

AI 브라우저 혁명이 다가오고 있습니다

ChatGPT가 등장한 이후, 많은 팀이 AI 브라우저를 시도했습니다. 가장 초기에는 ChatGPT for Google을 볼 수 있었습니다. Google 검색 결과 옆에 AI의 답변을 표시할 수 있어 순식간에 수백만 명의 사용자 등록을 유치했습니다. 그 후 Sider와 Monica의 출시로 Google 검색 결과를 강화할 수 있을 뿐만 아니라, 페이지에서 언제든지 AI 어시스턴트를 호출할 수 있으며, 비디오 사이트, chat pdf, 이미지 사이트에 대한 특별한 최적화를 수행하여 AI가 언제든지 콘텐츠 생성, 수정 및 분석에 참여할 수 있게 되어 사용자 경험이 크게 향상되었습니다. 지금까지도 저는 이러한 플러그인의 충실한 사용자입니다. Sider만 해도 Chrome에 600만 명의 사용자가 있어 AI 브라우저 플러그인 1위라고 할 수 있습니다.

이후 Tool Use와 MCP의 등장과 광범위한 사용으로 AI 브라우저는 쿼리, 대화 상자 내에서 텍스트 및 이미지 생성뿐만 아니라 도구를 통해 브라우저 기능을 호출하여 더 복잡한 작업을 완료할 수 있게 되었습니다. 작년 Browser Use가 이 개념을 제안한 이후, 올해 Claude for Chrome, Comet, ChatGPT Atlas의 등장으로 각 회사가 Agentic Browser를 출시했으며, 가장 큰 특징은 자동으로 작업을 완료할 수 있다는 것입니다. Query에서 Action으로, 사용자 작업이 수동적 탐색에서 능동적 자동화로 전환되었습니다.

1. 전통적인 브라우저의 근본적인 병목 현상: "표시"만 하고 "완료"하지 않음

전통적인 브라우저의 역할은: 웹 페이지 열기、정보 표시、사람이 클릭, 복사, 판단, 이동할 때까지 기다림。하지만 진정한 목표는 "웹 페이지 보기"가 아니라: 적절한 제품 찾기、 세금 신고 / 티켓 예약 / 양식 작성、옵션 비교 및 결정 내리기、정보를 결과로 변환하는 것입니다.

브라우저에서 사람이 하는 일은 실제로 프로세스 실행자이며 "독자"가 아닙니다. AI 브라우저의 핵심 업그레이드는:

2. 현대 웹의 콘텐츠 폭발

현실적인 문제는: 페이지가 점점 더 복잡해지고 있음(다단계, 팝업, CAPTCHA, 옵션)、정보 밀도가 점점 더 높아지고 있음(가격 비교, 약관, 리뷰, 정책)、작업이 점점 더 프로세스화되고 있음(신청, 등록, 비교, 제출)。 반면 인간은: 클릭이 느림、기억이 제한적、실수하기 쉬움、반복 프로세스에 능숙하지 않음。

작업을 자율적으로 실행하는 AI 브라우저는 본질적으로: 피로하지 않음、단계를 놓치지 않음、병렬 실행 가능、지속적으로 경로 최적화 가능。

3. 정보 시대의 핵심 병목 현상이 "정보 획득"에서 "결정 실행"으로 전환

과거의 문제는:

• 정보가 너무 적음 → 검색 엔진이 필요함

현재의 문제는:

• 정보가 너무 많음 → 결정 및 실행 비용이 너무 높음

예:

• 가장 비용 효율적인 항공편 + 수하물 규칙 + 변경 정책 선택

• 20개 공급업체에 맞춤형 이메일 보내기 및 후속 조치

• 회사 정책에 따라 비용 청구 / 조달 프로세스 완료

이것들은 "검색하면 끝"이 아니라 주로 목표 이해, 제약 조건 평가, 단계 실행입니다.

전통적인 모델은:

사람 → 지휘 → 소프트웨어 → 피드백 대기 → 사람이 다시 작업

AI 브라우저 모델:

사람 → 목표 및 경계 설정
AI → 자율적 계획 + 실행 + 결과 보고

4. 왜 브라우저인가?

컴퓨터는 사람과 정보 사이의 매개체로 탄생했습니다. 브라우저는 기본적으로 90%의 작업 및 생활 시스템을 다루며, SaaS, 정부 서비스, 금융, 콘텐츠 플랫폼에 연결할 수 있습니다. 각 제공업체가 API를 제공할 때까지 기다릴 필요 없이 "인간 인터페이스" 계층에서 직접 작업을 완료할 수 있습니다. 이것은 현재 제 의견으로는, 가장 현실적이고, 저항이 가장 적으며, 확장성이 가장 큰 AI 자동화 구현 경로입니다.

한 문장으로 AI 브라우저가 필요한 이유를 요약하면:

AI 브라우저의 구현 원리

AI 브라우저 구현의 핵심은 페이지를 효율적으로 이해하는 방법에 있습니다. 다음과 같은 경로가 있습니다:

1. DOM Tree(DOM 트리)——가장 직관적이지만 가장 취약한 방법

• document / HTML을 직접 읽기

• DOM 노드를 텍스트로 직렬화

• LLM에 이해 + 작업 생성 전달

HTML / DOM → serialize → LLM → action

Playwright / Puppeteer도 DOM 접근 방식을 따릅니다. DOM 처리에서 많은 더러운 작업을 수행하여 비교적 깨끗한 DOM 트리 표현을 얻을 수 있습니다. 하지만 이 접근 방식에는 다음과 같은 문제가 있습니다:

❌ DOM ≠ 사용자가 보는 인터페이스

❌ div 안에 div, DOM은 의미 표현이 아니어서 의미 손실 발생

❌ LLM 토큰 폭발

2. Visual Tree / OCR(시각 이해 파)

웹 페이지를 "스크린샷"으로 취급하고, OCR + Vision Model을 사용하여: 버튼, 텍스트, 입력 필드를 식별한 다음 AI가 좌표로 클릭하도록 함

Screenshot → Vision Model → UI elements → click(x,y)

현재 OpenAI에는 computer-use-agent(cua) 모델도 있어 스크린샷과 작업을 기반으로 작업을 생성할 수 있습니다. 이 접근 방식의 장점은 더 보편적이며, 브라우저의 웹 페이지 표현에 의존하지 않고 모든 브라우저, 모든 운영 체제의 자동화로 확장할 수 있다는 것입니다. 이 솔루션은 보편적이지만 비용과 지연 시간이 높으며, 현재 ChatGPT Atlas조차 cua를 사용하여 자동화를 수행하지 않습니다.

3. Accessibility Tree(접근성 트리)——AIPex의 경로

원리(중요 포인트)

브라우저 내부에는 실제로 "스크린 리더용 의미 트리"가 있습니다:

• role: button / textbox / link

• name: 인간이 읽을 수 있는 이름

• state: disabled / checked / expanded

• hierarchy: 실제 UI 구조

DOM → Accessibility Tree → Semantic UI Graph → LLM

왜 AI에 완벽한가?

AI 브라우저의 제품 형태

현재 브라우저 자동화를 구현하는 다음과 같은 제품 형태가 있습니다. 하나씩 분석하겠습니다:

1. Agent 브라우저

Agent 브라우저는 Comet, ChatGPT Atlas와 같은 독립적인 AI 브라우저 애플리케이션을 의미합니다. 이러한 제품은 브라우저를 재구축하고 AI 기능을 브라우저 커널에 깊이 통합합니다.

장점:

• 깊은 통합: AI 기능이 브라우저 커널과 깊이 통합되어 브라우저 동작을 더 낮은 수준에서 제어할 수 있음
• 통일된 경험: 모든 기능이 하나의 애플리케이션에 있어 더 통일된 경험
• 성능 최적화: AI 시나리오에 맞춘 특별한 성능 최적화 가능

단점:

• 마이그레이션 비용이 높음: 사용자는 기존 브라우저를 포기하고 북마크, 확장 프로그램, 비밀번호 등의 데이터를 마이그레이션해야 함
• 생태계 분열: Chrome/Edge의 풍부한 확장 프로그램 생태계를 사용할 수 없음
• 학습 곡선: 사용자는 새로운 브라우저 인터페이스와 작업 습관에 적응해야 함
• 개발 비용: 브라우저를 처음부터 구축해야 하므로 개발 비용이 매우 높음

대표적인 예: Comet, ChatGPT Atlas, Dia

2. 플러그인 / 확장 프로그램 방식

플러그인/확장 프로그램 방식은 AIPex와 같이 기존 브라우저(Chrome, Edge 등)를 기반으로 개발된 확장 프로그램을 의미합니다. 이 방식은 기존 브라우저 위에 AI 자동화 기능을 추가합니다.

장점:

• 제로 마이그레이션 비용: 모든 북마크, 확장 프로그램, 비밀번호, 기록 보관
• 즉시 사용 가능: 설치 후 즉시 사용 가능, 사용 습관 변경 불필요
• 생태계 호환성: Chrome/Edge의 풍부한 확장 프로그램 생태계를 계속 사용할 수 있음
• 높은 개발 효율성: 성숙한 브라우저 API를 기반으로 하므로 개발 비용이 상대적으로 낮음
• 높은 사용자 수용도: 사용자는 브라우저 사용 습관을 변경할 필요가 없음

단점:

• API 제한: 브라우저 확장 프로그램 API의 기능 경계에 제한됨
• 성능 제약: 브라우저의 다른 확장 프로그램 및 기능과 조정해야 하므로 성능에 영향을 받을 수 있음

대표적인 예: AIPex, Claude for Chrome

경로 비교

실제 구현 관점에서 플러그인/확장 프로그램 방식은 현재 가장 현실적이고, 저항이 가장 적으며, 사용자 수용도가 가장 높은 경로입니다. 사용자는 확립된 워크플로우와 습관을 포기할 필요 없이 AI 자동화 기능을 얻을 수 있습니다. 이것이 AIPex가 확장 프로그램 경로를 선택한 핵심 이유입니다.

AIPex의 장점

제품 장점

1. 마이그레이션 불필요

Comet, ChatGPT Atlas와 같이 완전히 새로운 브라우저를 설치해야 하는 솔루션과 달리 AIPex는 Chrome/Edge 확장 프로그램입니다.

• 제로 마이그레이션 비용: 플러그인만 설치하면 사용할 수 있음
• 모든 데이터 보관: 북마크, 확장 프로그램, 비밀번호, 기록, Cookie 모두 보관
• 습관 변경 불필요: 친숙한 브라우저 인터페이스 및 작업 방식 계속 사용
• 즉시 사용 가능: 확장 프로그램 설치 후 즉시 사용 가능, 새로운 인터페이스 학습 불필요
• 생태계 호환: Chrome/Edge의 풍부한 확장 프로그램 생태계를 계속 사용할 수 있음

"Your browser already works!" —— 귀하의 브라우저는 이미 잘 작동합니다. 우리는 단지 더 스마트하게 만들 뿐입니다.

2. 오픈 소스 및 개인정보 보호

AIPex GitHub 저장소

읽고 작업을 실행할 수 있는 AI 에이전트의 경우 개인정보 보호 및 보안이 매우 중요합니다. AIPex는 MIT 오픈 소스 라이선스를 채택하여 완전히 투명하고, 감사 가능하며, 확장 가능합니다:

• 완전히 오픈 소스: 코드가 완전히 공개되어 누구나 검토, 기여, 포크할 수 있음
• 개인정보 우선: 귀하의 데이터는 절대 귀하의 컴퓨터를 떠나지 않으며, 데이터를 완전히 귀하의 컴퓨터 내에 보관하며 서버에 업로드하지 않음
• BYOK(자체 키 가져오기): 자신의 API 키를 사용하여 데이터 흐름을 완전히 제어

ChatGPT Atlas, Dia와 같이 유료 구독이 필요하고 데이터를 서버에 업로드해야 하는 솔루션과 비교하여 AIPex는 개인정보 보호 및 보안 측면에서 명확한 장점이 있습니다.

3. 우수한 컨텍스트 엔지니어링

AIPex는 컨텍스트 엔지니어링 측면에서 대량의 최적화를 수행했으며, 이것이 효율적이고 정확하게 작업을 완료할 수 있는 핵심 기술적 장점입니다:

접근성 트리 + 검색 리콜 메커니즘:

• 전통적인 DOM 대신 의미적으로 더 풍부한 접근성 트리(Accessibility Tree) 사용
• 의미 검색을 통해 필요에 따라 관련 요소를 리콜하며, 전체 페이지를 전달하지 않음
• 컨텍스트 길이를 크게 줄여 응답 속도 및 정확도 향상

지능형 스냅샷 중복 제거:

• 동일한 탭의 최신 페이지 스냅샷만 보관
• 컨텍스트 복잡도를 O(n²)에서 O(n)으로 감소
• 50회 작업: 1,275개 스냅샷에서 50개 스냅샷으로(96% 토큰 절약)

Search-based Element Retrieval:

웹 페이지 콘텐츠를 처리할 때 AIPex는 임베딩 기반 RAG 기술을 사용하지 않습니다. 코드와 비교하여 웹 페이지는 항상 변화하며, 정적 임베딩은 웹 페이지를 분석하는 시나리오에 적응하기 어렵습니다. Claude Code 및 Cline의 접근 방식과 일치하여 AIPex는 웹 페이지를 임베딩 저장하지 않고 최적화된 검색을 사용하여 대규모 모델이 필요한 요소를 판단하도록 합니다. 전체 페이지 콘텐츠를 대규모 모델에 전달하는 것도 아니고, 임베딩 기반 RAG 기술도 아닙니다.

이러한 기술 혁신으로 AIPex는 높은 정확도를 유지하면서 계산 비용 및 응답 시간을 크게 줄일 수 있습니다.

4. Skills 지원

AIPex는 **Claude Agent Skills**와 원활하게 통합되어 브라우저 자동화에 무한한 가능성을 엽니다:

• 스킬 가져오기: 커뮤니티가 만든 수천 개의 사전 구축된 스킬에 액세스하여 자동화 기능 확장
• 스킬 내보내기: 성공한 AIPex 워크플로우를 재사용 가능한 스킬로 내보내기
• 스킬 조합: 여러 스킬을 혼합하여 매칭하고 복잡한 자동화 워크플로우 생성
• 생태계 협력: Claude 생태계의 집단 지식에서 이익 얻기

이것은 AIPex를 사용할 수 있을 뿐만 아니라 전체 Claude Agent Skills 생태계를 활용할 수 있음을 의미하며, 작업을 재사용 가능하고 공유 가능하며 더 빠르고 효율적으로 만듭니다.

5. 지능형 개입

AIPex는 작업에 확인이 필요한 경우 지능적으로 사용자에게 확인을 요청하여 결제, 확인 제출 등의 중요한 기밀 작업의 보안을 보장합니다.

6. 타겟팅된 사용자 시나리오

AIPex는 웹 페이지와 사용자 작업을 이해할 수 있으므로 사용자 가이드 문서 작성("Vercel에서 도메인을 만드는 방법은?")과 같은 특정 시나리오에 대해 타겟팅된 최적화를 수행했습니다.

이전에는 시스템의 사용자 문서를 작성하려면 다음이 필요했습니다:

• 사용자 관점으로 돌아가 문서에 기술 용어가 나타나지 않도록 보장

• 각 단계를 수동으로 기록하고 각 단계에 대한 설명 문서 작성

• 각 단계를 수동으로 스크린샷하고 주요 주석 추가

• 각 단계의 문서를 정리하고 포맷하여 최종적으로 문서 형성

하지만 이제는 AIPex의 사용자 가이드 기능을 열고 작업을 기록하기만 하면 AIPex가 자동으로 사용자 가이드 문서를 생성합니다.

이 효율성 향상은 혁명적입니다. 인간으로서 더 이상 포맷, 사용자 관점, 기술 용어에 집중할 필요가 없으며, 이 모든 것은 AIPex가 준비합니다. 최종 제품에만 관심을 기울이고 언제든지 업데이트할 수 있습니다. "사용자 가이드 작성"과 같은 세분화된 시나리오가 많이 있으며, 엔드투엔드 테스트, 제품 데모 기록 등 AIPex는 이러한 세분화된 시나리오에 대해 더 나은 솔루션을 제공할 수 있습니다. 기대해 주세요.

AIPex가 어떻게 탄생했는가

처음에 저는 단지 브라우저 내의 raycast 같은 것을 만들고 싶었습니다. 어디서든 호출할 수 있고, 탭 전환(Arc 브라우저의 Command + T 단축키와 유사하게 탭을 선택하여 전환), 탭 페이지 정리(40개 이상의 탭을 처리해야 하며 수동 정리는 매우 번거로움), 어디서든 AI 어시스턴트 호출(이메일 보내기, 트위터 보내기, 질문하기 여부)을 도와줍니다. 그래서 AIPex의 첫 번째 버전을 개발했습니다. 이 버전은 제가 직면한 멀티 탭 문제를 최적화할 수 있었고 일부 페이지에서 AI에 질문할 수 있었지만, 아직 충분히 멋지지 않다고 느꼈습니다.

작년 이때 Anthropic는 Computer Use Operator 개념을 제안했습니다. 이어서 Browser Use도 AI 브라우저 자동화 개념을 제안했습니다. 기술 발전으로 주로 tool use와 mcp의 발전으로 일부 chrome의 mcp가 등장했습니다. 예를 들어 mcp-chrome, playwright-mcp, browserMCP, devtools-mcp 프로젝트입니다. 저는 cursor에서 시도했는데, 가장 큰 문제는 모두 헤드리스 브라우저를 사용하여 사용자의 로그인 상태를 재사용할 수 없고, 개입 없이 제가 소홍서에 게시하는 것조차 도울 수 없다는 것이었습니다. 실제로 이러한 mcp client, servers 분리에도 컨텍스트 낭비 문제가 있으며, cursor는 타겟팅된 컨텍스트 최적화를 수행할 수 없습니다.

그래서 저는 브라우저에서 직접 사용할 수 있고, 사용자의 로그인 상태를 재사용하며, 자연어로 브라우저 동작을 제어하고, 브라우저에 대한 타겟팅된 컨텍스트 최적화를 수행할 수 있는 chrome 확장 프로그램을 만들고 싶었습니다. 이전에는 실제로 MCP가 무엇인지, tool use가 무엇인지, Agent Loop가 무엇인지 이해하지 못했습니다. cursor 선생님과 일주일 동안 겨룬 후 AIPex의 첫 번째 버전을 갖게 되었으며, 80개 이상의 브라우저 도구를 다룹니다. 당시 AIpex 코드를 오픈 소스로 공개하고 첫 번째 데모 비디오 "Google을 사용하여 MCP를 연구하는 것을 도와주세요"를 기록했습니다. AIPex는 Google을 열고, MCP를 입력하고, 검색을 클릭하고, 더 나아가 하위 링크를 클릭하여 연구하고, 최종적으로 MCP에 대한 보고서를 생성했습니다.

저는 이 데모를 리더, 동료, 친구들과 공유했고, 그들은 모두 매우 관심이 있었으며 여기서 무엇이 수행되었는지 이해하고 싶어했습니다. 처음에는 AIPex를 여가 시간에 만든 장난감으로 취급했습니다. Glace는 첫 번째로 기여한 친구입니다. AIPex에 대해 그는 무한한 열정과 아이디어를 가지고 있으며, AIPex의 기능을 사용하여 작업에서 직면한 실제 문제를 해결하기를 희망합니다. 예를 들어 사용자 문서 작성, 인터페이스 엔드투엔드 테스트 등. 저는 그와 제품 형태 및 요구 사항에 대해 소통했습니다. 공통점은 저와 그가 모두 typescript 순수 초보자였지만 cursor 선생님의 코드 수준을 절대적으로 신뢰했다는 것입니다. Glace의 높은 에너지는 저에게 더 큰 영향을 미쳐 AIPex가 흥미롭고 가치 있다는 것을 알게 하고, AIPex를 더욱 최적화하도록 추진했습니다.

AIPex에 대해 알게 된 동료와 친구가 늘어남에 따라 더 많은 요구 사항과 수정 제안을 받았습니다. 더 심각한 것은 첫 번째 버전의 UI가 비교적 추악했고, 거의 네이티브 컴포넌트와 서드파티 컴포넌트를 혼용했다는 것입니다. 이로 인해 UI 스타일이 보기 좋지 않고 일관성이 없으며 일부 버그가 존재했습니다. Ken은 국경절에 완전히 ai elements를 사용하여 AIPex의 UI를 재구축했으며, 이 코드 변경량은 당시의 1/2를 차지했습니다. 최종 효과는 매우 놀라웠고 현재의 AIPex UI가 되었습니다. 나중에 Claude Agent Skills가 등장하자 Ken은 일주일 이내에 Skill을 1:1로 복제하여 AIPex에 통합했습니다. Skill은 prompt + 스크립트를 사용하여 이번 성공한 실행 프로세스를 기록할 수 있으며, 다음에 사용할 때 AIPex는 Skill을 기반으로 더 일관되고 더 빠르게 수행할 수 있습니다.

현재 k8s/golang/supabase/tidb 기여자卡神도 우리에 합류했습니다. gemini-cli, openai-agents-sdk, spring-ai와 같은 시장의 주류 AI 에이전트 구현 방법을 연구한 후 오픈 소스 저장소를 리팩토링했습니다. AIPex의 오픈 소스 코드는 더 이해하기 쉽고, 더 표준화되었으며, 더 유지보수하기 쉬워졌습니다. 卡神은 오픈 소스 커뮤니티 운영을 계속 도와줄 것입니다.

우리는 여전히 4명의 작은 팀입니다. 저와 Glace는 주로 제품을 담당하고, Ken은 시니어 프론트엔드 개발자로 AIPex와 같은 리치 프론트엔드 모델 에이전트에 매우 중요합니다. 卡神은 시니어 오픈 소스 기여자로 우리 프로젝트의 오픈 소스 로드맵과 커뮤니티 운영에 매우 중요합니다. 현재 우리는 모두 여가 시간에 AIPex에 기여하고 있습니다. 제품 측면에서 목표는 제품 데모 기록, 엔드투엔드 테스트, UI 비교 등 더 적합한 수직 시나리오를 계속 개발하는 것이며, 각 수직 시나리오는 다른 사람들의 문제를 해결합니다. 마케팅 측면에서는 많은 자금을 투입하지 않으며, SEO 최적화를 시도하고 있습니다. SEO는 실제로 1년 동안 연구했으며, AI 내비게이션 사이트를 만들어 일정한 성과를 얻었지만 AIPex에서는 아직 좋은 효과를 얻지 못했습니다. 현재 목표는 안정적이고 상당한 MRR을 달성하는 것입니다. 협력 의향이 있으시면 https://www.claudechrome.com/zh/contact 에서 연락할 수 있습니다.