Aside 브라우저: Playwright MCP를 걷어내고 브라우저 레이어를 바꿨습니다

브라우저를 갈아탔습니다. 이번에는 Aside입니다.

예전에 Arc를 쓰다가 Firefox 기반의 Zen으로 옮겼고, 그다음에는 Arc를 만든 Browser Company가 내놓은 Dia를 AI 브라우저로 써왔습니다. 그런데 이번에는 그걸 전부 정리하고 Aside로 왔습니다.

이번엔 갈아탄 이유가 좀 다릅니다. 디자인이나 탭 구조 때문이 아니라, 개발할 때 쓰던 도구 세 개가 통째로 필요 없어졌기 때문입니다.

AI 브라우저는 이미 흔해졌습니다

지금 AI 브라우저는 널려 있습니다. OpenAI의 Atlas가 있고, Perplexity의 Comet이 있고, Dia가 있고, Chrome에는 Gemini가 붙었습니다. Brave의 Leo나 Opera의 Neon 같은 것도 있죠.

그래서 “AI가 붙은 브라우저”라는 것만으로는 이제 갈아탈 이유가 되지 않습니다. 제가 Aside에서 본 건 다른 지점입니다.

Aside는 Chromium 기반 독립 앱입니다. Chrome에 붙이는 확장 프로그램이 아닙니다. Y Combinator 배치 스타트업이고 창업자 세 분이 전부 한국인이라 국내에서도 주목을 좀 받았습니다.

에이전트가 로그인까지 하고 주문을 끝냅니다

기능을 길게 나열하기보다 실제로 시켜본 걸 하나 보여드리는 게 빠를 것 같습니다.

어제 Aside에 “쿠팡에서 클렌징 워터 하나 주문해줘”라고 시켰습니다. 그랬더니 쿠팡 사이트를 열고, 클렌징 워터를 검색하고, 로그인이 필요한 단계에서 멈추지 않고 제가 쓰는 패스워드 매니저인 Bitwarden 확장을 열어서 계정 정보를 찾아냈습니다. 아이디와 비밀번호를 입력해 로그인까지 끝내고, 랭킹 1위 제품을 골라 배송지를 넣고 결제 비밀번호 창까지 띄웠습니다.

결제 비밀번호까지 매니저에 저장해뒀다면 결제도 그대로 끝냈을 겁니다. 주문한 물건은 다음 날 아침에 도착했습니다.

여기서 중요한 건 “AI가 쇼핑을 대신해준다”가 아닙니다. 이미 로그인된 내 브라우저 위에서 에이전트가 움직인다는 구조 자체입니다. 이게 뒤에 나올 이야기의 전부입니다.

이 밖에도 대화와 방문기록에서 맥락을 쌓아두는 메모리, 정해진 시간에 작업을 자동으로 돌리는 루틴 같은 기능이 있습니다. 이런 건 다른 AI 브라우저에도 있으니 짧게 넘어가겠습니다.

제가 안 쓰게 된 도구 세 개

개발자 입장에서 중요한 부분은 여기부터입니다.

Aside로 옮기면서 안 쓰게 된 게 세 개 있습니다.

1. Playwright MCP. 에이전트에게 브라우저를 쥐여주는 표준처럼 쓰이던 도구입니다.
2. Claude Code 인앱 브라우저.
3. Codex 인앱 브라우저. 예전에 제가 영상으로 소개까지 했던 기능입니다.

셋 다 하는 일은 비슷합니다. 에이전트가 화면을 열어보고, 클릭해보고, 스크린샷을 찍어 확인하는 거죠. 문제는 이게 도구마다 따로 놀았다는 겁니다. Claude Code에서 확인하는 방식과 Codex에서 확인하는 방식이 다르고, Playwright MCP는 또 별도로 세팅해야 했습니다.

저는 이걸 검증 레인이라고 부르는데요, 에이전트가 화면을 확인하는 통로 자체를 하나로 정리하고 싶었습니다. Aside가 그걸 해결해줬습니다.

코딩 에이전트에 스킬로 심어둡니다

Aside 설정에 Developers 메뉴가 있습니다. 여기에 CLI, MCP 서버, 그리고 Aside Skills가 있습니다.

드롭다운에서 Claude Code를 고르면 홈 디렉토리의 스킬 폴더에 aside-browser 디렉토리가 생기고 안에 SKILL.md가 들어옵니다. 열어보면 그냥 “이런 명령어가 있습니다” 수준이 아닙니다.

언제 exec를 쓰고 언제 repl을 써야 하는지, 페이지를 읽을 때는 스냅샷을 1순위로 쓰라는 것, 스냅샷을 새로 뜨면 이전에 잡아둔 요소 ID는 전부 무효가 되니 다시 잡으라는 것, 파일 다운로드는 이렇게 검증하라는 것까지 적혀 있습니다.

도구만 주는 게 아니라 그 도구를 쓰는 판단 기준까지 같이 배포하는 겁니다.

저는 이게 MCP와 결정적으로 갈리는 지점이라고 봅니다. MCP는 보통 도구 목록을 넘겨줍니다. 뭘 쓸 수 있는지는 알려주지만, 언제 어떻게 써야 하는지는 에이전트가 알아서 판단해야 하죠. Aside는 그 판단 기준을 문서로 같이 넣어줍니다.

설치는 CLI를 먼저 깔고, 스킬이나 MCP를 쓰는 코딩 에이전트에 붙이면 끝입니다. 그다음부터는 Claude Code에 “화면 확인해줘”라고만 해도 알아서 aside repl을 부릅니다. 프롬프트에 사용법을 적어줄 필요가 없습니다.

exec와 repl은 성격이 다릅니다

스킬에서 쓰는 명령은 두 가지입니다. 헷갈리기 쉬운데 성격이 완전히 다릅니다.

	aside exec	aside repl
정체	Aside 브라우저 에이전트 호출	자바스크립트 REPL
주는 것	자연어로 목표	코드로 절차
누가 판단	AI가 알아서 단계를 정함	내가 정한 대로만
재현성	같은 걸 또 돌려도 다를 수 있음	같은 코드면 같은 결과
쓰는 곳	로그인 계정, 확장, 방문기록을 넘나드는 작업	화면 검증, 스크린샷, 다운로드

한 줄로 하면 exec는 맡기는 것, repl은 직접 하는 것입니다.

저는 검증에는 repl만 씁니다. exec는 중간에 AI가 하나 더 끼는 구조라, 같은 걸 다시 돌렸을 때 같은 결과가 나온다는 보장이 없습니다. 검증 근거로 쓰기에는 곤란하죠. exec는 심부름용으로 따로 떼놨습니다.

토큰을 직접 재봤습니다

궁금한 건 결국 이거일 겁니다. 그래서 토큰은 얼마나 쓰냐.

직접 재봤습니다. 성격이 다른 페이지 다섯 개를 골라서 각 도구가 컨텍스트에 실제로 집어넣는 문자 수를 셌습니다.

먼저 도구 정의부터 봅니다. 작업을 하든 안 하든 세션 내내 컨텍스트에 올라가 있는 고정 비용입니다.

	노출 도구 수	도구 정의 크기
Playwright MCP	24개	18,502자
Aside	1개 (repl)	4,951자

3.7배 차이입니다. 페이지가 뭐든 상관없이 깔고 들어가는 값이라 가장 안정적인 수치입니다.

Playwright MCP는 클릭, 타이핑, 스냅샷, 스크린샷을 전부 개별 도구로 노출합니다. Aside는 repl 하나만 노출하고 그 안에서 자바스크립트로 처리합니다.

그다음 페이지 읽기입니다.

페이지	Playwright MCP	Aside	Claude Code	Codex
GitHub 저장소	25,711	13,872	36,002	25,291
Hacker News	49,263	11,814	20,826	42,540
MDN 문서	71,457	58,792	52,401	42,176
Wikipedia	142,433	48,706	175,098	98,144
Tailwind 랜딩	34,346	12,760	24,003	17,292
합계	323,210	145,944	308,330	225,443

합계로는 Aside가 가장 작습니다. 다만 페이지마다 차이가 꽤 흔들립니다. Hacker News처럼 링크가 촘촘한 목록에서는 4.2배까지 벌어지는데, MDN 같은 장문 문서에서는 1.2배로 거의 붙습니다.

왜 이런 차이가 나느냐면, Playwright 쪽 스냅샷을 열어보면 아무 의미 없는 컨테이너 노드까지 전부 펼쳐져 있습니다. generic이 계속 반복되죠. 링크가 많은 페이지일수록 이 껍데기가 커집니다.

도구 정의와 페이지 읽기를 합쳐서, 다섯 페이지를 읽는 세션 하나로 보면 이렇습니다.

	도구 정의	페이지 5개	합계
Playwright MCP	18,502	323,210	341,712자
Aside	4,951	145,944	150,895자

합계 기준 약 2.3배, 토큰으로 치면 4만 7천 토큰 정도 차이입니다.

여기에는 단서를 붙여야 합니다. 각 도구로 한 번씩 잰 값이고 통제된 반복 실험이 아닙니다. 같은 페이지도 다시 재면 값이 흔들립니다. GitHub 저장소 페이지는 잴 때마다 32,518자, 37,093자, 25,711자로 나왔습니다. 정밀한 벤치마크라고 부를 생각은 없습니다.

그리고 Playwright MCP가 나쁜 도구라는 뜻도 아닙니다. 도구가 24개로 잘게 나뉘어 있으면 그만큼 쓰기 쉽고 진입장벽이 낮습니다. Aside repl은 자바스크립트를 직접 써야 하죠. 컨텍스트를 아끼는 대신 치르는 값이 있는 겁니다.

갈아탄 진짜 이유는 로그인 세션입니다

솔직히 말하면 제가 갈아탄 이유는 이 숫자가 아닙니다. 토큰은 아껴서 좋은 거지, 그것 때문에 도구를 바꾸지는 않습니다.

진짜 이유는 로그인입니다.

Playwright로 브라우저를 띄우면 그건 완전히 새 프로필입니다. 로그인이 하나도 없습니다. 필요하면 그 안에서 다시 로그인해야 하죠. Claude Code의 브라우저는 아예 공식 문서에 못을 박아놨습니다. 개인 브라우저와 분리된 깨끗한 프로필이고 저장된 로그인이 없다고요. 로그인 상태로 뭔가 하려면 Chrome 확장을 따로 쓰라고 안내합니다.

그런데 제가 에이전트에게 확인시키고 싶은 화면은 대부분 로그인해야 보이는 것들입니다. 관리자 페이지, 대시보드, 스테이징 서버 같은 것들이죠.

Aside는 제가 이미 로그인해둔 브라우저 그 자체입니다. 그러니까 이건 편의의 문제가 아니라 로그인이 필요한 화면을 에이전트에게 맡길 수 있느냐 없느냐의 문제입니다.

그리고 눈치채셨겠지만, 여기서부터 무서운 이야기가 시작됩니다.

보안은 카테고리 전체의 문제입니다

로그인 세션을 통째로 넘겨주고 브라우저 작업을 시키는 구조라면, 보안을 신경 쓰지 않을 수가 없습니다.

프롬프트 인젝션부터 봅시다. 웹페이지 HTML 안에 눈에 보이지 않는 악의적인 프롬프트를 심어두고, 에이전트가 그 페이지를 읽는 순간 내 지시가 아니라 그 숨은 명령을 따르게 만드는 공격입니다. 에이전트가 내 로그인 세션을 전부 물려받은 상태라면 그 피해 범위가 곧바로 커지죠.

이건 Aside만의 문제가 아닙니다. OpenAI도 Atlas 브라우저와 관련해 프롬프트 인젝션이 여전히 에이전트 보안의 미해결 과제이고 앞으로도 수년간 지속적인 노력이 필요할 것으로 본다고 밝혔습니다. 완전한 해결은 어렵다는 이야기죠.

Aside가 제공하는 장치는 이렇습니다.

권한 모드가 세 가지입니다.

• Read only: 보기만 합니다.
• Guard(기본값): 승인된 폴더에서만 작업하고 나머지는 물어봅니다.
• Full access: 전체 읽기와 쓰기를 허용합니다.

기본은 Guard로 두고 쓰시는 걸 권합니다.

비밀번호 처리도 짚어둘 만합니다. Aside는 자체 패스워드 매니저를 가지고 있고, 기존에 쓰던 매니저를 연결할 수도 있습니다. 저는 Bitwarden을 연결해서 씁니다. 문서에는 에이전트가 로그인 동작은 수행하지만 비밀번호 원문은 받지 않는다고 적혀 있습니다. Full access를 줘도 비밀번호 값 자체는 에이전트에 노출되지 않는다는 겁니다.

다만 이 부분은 제가 직접 뚫어보고 확인한 게 아니라 문서에 그렇게 적혀 있다는 정도로만 참고해주시면 좋겠습니다.

설정에서 서드파티 쿠키 허용 여부도 정할 수 있고, 사용 데이터를 제품 개선에 쓰는 항목은 기본으로 켜져 있으니 신경 쓰이면 꺼두시는 걸 권합니다.

프로필을 나눠서 쓰면 훨씬 안전해집니다

제품이 주는 장치는 여기까지고, 저는 여기에 제 규칙을 하나 더 얹었습니다.

Aside는 프로필을 여러 개 만들어 쓸 수 있습니다. 저는 세 개를 운영합니다. 개인용, 회사 업무용, 그리고 Aside에 Full access를 줄 때 쓰는 용도입니다. 세 번째는 게스트 모드로 두고 중요한 로그인은 전부 해지해뒀습니다.

로그인 세션이 걱정되신다면 두 가지만 해두셔도 됩니다.

첫째, 검증 전용 빈 프로필을 하나 만드세요. 만들고 나서 아무 데도 로그인하지 않습니다.

둘째, 코딩 에이전트의 규칙 파일에 한 줄 적어두세요. 브라우저로 화면을 확인할 때는 이 프로필로 열라고요. 저는 Claude Code와 Codex가 같이 읽는 규칙 파일에 적어놨습니다. 그러면 매번 말하지 않아도 알아서 그 프로필로 엽니다.

여기서 주의하실 게 하나 있습니다. 계정 목록에 signed out이라고 떠도 로그인이 없다는 뜻이 아닙니다. 그건 Aside 서비스에 로그인했는지를 가리키는 표시이지, 브라우저에 쿠키가 남아 있는지를 말하는 게 아닙니다.

그래서 프로필을 만든 다음에는 직접 한 번 열어보세요. GitHub 같은 사이트를 열었을 때 로그인 버튼이 보이고 계정 메뉴가 없으면 제대로 빈 프로필입니다. 표시만 믿지 마시고 확인해보시는 게 좋습니다.

이사 비용은 생각보다 적습니다

브라우저를 옮길 때 제일 귀찮은 게 북마크, 로그인 세션, 쿠키가 전부 날아가는 겁니다.

Aside는 설정에서 Chrome, Safari, Firefox 등 대부분의 브라우저에서 임포트할 수 있습니다. 방문기록과 북마크만 오는 게 아니라 쿠키까지 같이 오기 때문에 기존 로그인 세션이 그대로 살아 있습니다. 저는 옮기고 나서 다시 로그인한 사이트가 거의 없습니다.

마무리

Aside는 제가 지금까지 써본 AI 브라우저 중에 가장 좋았습니다. 요즘 주변에도 꽤 추천하고 있습니다.

다만 제가 더 중요하게 보는 건 브라우저를 통째로 갈아타는 부분이 아닙니다. 메인 브라우저를 옮기는 건 큰일이고, 굳이 안 하셔도 됩니다.

개발자시라면, 혹은 바이브 코딩을 하신다면 Aside의 에이전트 기능을 쓰던 코딩 에이전트에 스킬로 심어두는 것 정도는 해보시면 좋겠습니다. 평소 브라우징은 쓰던 걸 그대로 쓰시고, 에이전트가 화면을 확인할 때만 Aside를 부르는 구조도 충분히 현실적입니다.

결국 이 글에서 하고 싶은 이야기는 도구 하나를 바꾸라는 게 아닙니다. 도구를 주는 것과 도구를 쓰는 규칙을 주는 것은 다르다는 겁니다. 도구 정의에서 3.7배 차이가 난 것도 결국 그 설계 차이에서 나왔죠. 에이전트를 쓰실 때 이 관점으로 한 번 들여다보시면 좋겠습니다.

---

관련 영상

이 글과 연결된 영상은 개발동생 유튜브 채널에서 보기에서 확인할 수 있습니다.