CI를 모두가 후보로 꼽는 세 가지 오픈소스 시각적 회귀 테스트 도구(BackstopJS, Argos, Lost Pixel) 중 하나로 표준화하려다가, 검토를 시작한 지 일주일 만에 셋 중 둘이 밖에서 보이던 것과 다르다는 것을 발견하는 상황을 상상해 보세요. Argos는 GitHub에 훌륭한 코드가 있지만, 그 메인테이너는 셀프 호스팅이 지원되지도 문서화되지도 않았다고 분명히 말합니다. Lost Pixel은 팀이 Figma에 합류한 2026년 4월 22일에 아카이브되었고, 이미 사용하던 팀들에게 어떤 마이그레이션 경로도 남기지 않았습니다.
그러면 오늘날 정말로 셀프 호스팅이 가능하고 유지보수되는 것은 셋 중 정확히 하나만 남습니다. 이렇게 선택지가 많아 보이는 카테고리에 대해 말하기엔 이상한 얘기지만, 실제 지형은 그렇습니다. 사람들이 세 개의 동급으로 취급하는 도구들은 실제로는 작동하는 셀프 호스팅 옵션 하나, 다른 사람의 서버에서 사는 강력한 도구 하나, 그리고 당신이 벗어나야 할 하나입니다.
이것은 현실과의 충돌에서 살아남는 셀프 호스팅형 시각적 회귀 테스트 도구에 대한, 셀프 호스팅을 우선하는 관점의 글입니다. 어느 것이 어떤 제약에 맞는지, 그리고 지금 Lost Pixel을 쓰고 있다면 무엇을 해야 하는지를 다룹니다.
요약
- BackstopJS 은 셀프 호스팅이 가능하고, 유지보수되며, MIT 라이선스이고, 비용이 0인 옵션입니다. 기본으로 Puppeteer, Playwright 지원, Resemble.js를 통한 픽셀 비교, 그리고 HTML 리뷰 UI(계획에 넣어 둬야 하는 Docker 렌더링 관련 유의점 포함)를 갖췄습니다.
- Argos 은 워크플로 측면에서 더 강력한 도구지만(PR 리뷰, 그리고 2025년 말부터의 ARIA 스냅샷 비교), 실제로는 관리형 SaaS입니다. 메인테이너는 직접 운영하기 위한 지원도 문서도 제공하지 않습니다.
- Lost Pixel 은 2026년 4월에 아카이브되었습니다. 새 작업에는 채택하지 말고, 쓰고 있다면 지금 마이그레이션을 계획하세요.
한 줄 결론: 완전히 셀프 호스팅되는 CI 파이프라인에는 BackstopJS가 실용적인 선택입니다. 최고의 리뷰 워크플로를 원하고 SaaS 의존성을 받아들일 수 있다면 Argos가 더 나은 도구입니다.
(이 글이 다루지 않는 것: Cypress 기반 시각적 테스트, Storybook 특유의 컴포넌트 워크플로, 그리고 직접 측정한 성능 수치. 이 비교는 제가 직접 돌린 테스트 장치가 아니라 1차 출처의 사실로부터 구성되었습니다.)
셀프 호스팅형 시각적 회귀 테스트의 지형이 바뀌었다
지난 한 해 동안 있었던 두 가지 구체적인 사건이 이 후보 목록을 재편했고, 둘 다 그 사건들 이전에 쓰인 목록형 글을 기반으로 작업하고 있으면 놓치기 쉽습니다.
첫 번째: 2025년 9월의 GitHub 논의에서 Argos 메인테이너가 Argos는 관리형 서비스 외부에서 실행하는 것에 대해 지원도 문서도 제공하지 않는다고 밝혔습니다. 코드는 MIT 라이선스이고 공개되어 있어서 "직접 셀프 호스팅할 수 있다"는 기술적으로는 맞지만, 지원되는 경로는 없습니다. 이는 당신 자신이 그것의 당직이 되는 순간 엄청나게 중요해지는 구분입니다.
두 번째: Lost Pixel 리포지토리가 아카이브된 것은 2026년 4월 22일, 읽기 전용으로, 팀이 Figma에 합류한다고 발표했을 때입니다. 종료에는 어떤 마이그레이션 안내도 함께하지 않았습니다. 얼마 전까지 Percy와 Chromatic의 합당한 무료 셀프 호스팅 대안이던 도구가 이제 메인테이너 없는 의존물이 되었습니다.
두 변화 모두 같은 방향을 가리킵니다. 팀들이 애초에 여기에 이르는 이유, 즉 브라우저 곱하기 뷰포트 곱하기 페이지로 불어나는 SaaS 요금, 또는 미공개 UI의 스크린샷을 제3자에 업로드하는 것을 금지하는 컴플라이언스 규칙은 사라지지 않았습니다. 바뀐 것은 셀프 호스팅 메뉴가 보이는 것보다 짧다는 점입니다.
이 섹션의 핵심: 사람들이 후보로 꼽는 세 도구 중 오늘날 정말로 셀프 호스팅이 가능하고 활발히 유지보수되는 것은 하나뿐입니다.
BackstopJS: 정말로 셀프 호스팅이 가능한 옵션
설치는 npm install -g backstopjs (또는 로컬 프로젝트 설치)이며, 이 하나의 사실이 BackstopJS가 셀프 호스팅 축에서 이기는 이유의 대부분을 설명합니다. 리버스 엔지니어링해야 할 서비스도, 은밀히 의존하는 관리형 백엔드도 없습니다. 당신이 통제하는 인프라 위에서 MIT 라이선스로, 라이선스 비용 0으로, npm 패키지나 Docker 컨테이너로 실행됩니다. README 는 현재 라인(6.3.x)이 Node 20을 지원한다고 명시합니다.
내부적으로는 기본으로 Puppeteer(헤드리스 Chrome)를 구동하며 chromium, firefox, webkit 전반에서 Playwright도 지원합니다. 비교는 Resemble.js를 통한 픽셀 기반이며, 픽셀 편차가 얼마여야 실패로 계산되는지를 제어하는 구성 가능한 값 misMatchThreshold 을 가집니다. 승인은 변경을 수락하는 브라우저 내 UI를 갖춘 HTML 리포트를 통해 이뤄집니다.
제약은 전략적 결정이 내려지는 지점입니다. BackstopJS에는 내장된 PR 차단 워크플로가 없습니다. 차이가 존재한다고 알려주긴 하지만, 그것을 "이 PR은 병합할 수 없음" 게이트에 연결하는 것은 당신의 몫입니다. 설정은 한 번에 한 시나리오씩 JSON에 존재하며, 수백 개의 테스트 케이스가 되면 그 JSON 자체가 유지보수 대상 면이 됩니다. 개발은 빠르다기보다 느린 편입니다. 프로젝트는 아카이브되지 않았고, 패키지는 현재 버전 6.3.25에 있으며, 리포지토리는 GitHub 스타 약 7,200개와 열린 이슈 516개를 보여줍니다. 그러니 BackstopJS를 성숙하고 쓸 만한 것으로 대하되, 빠르게 진화하는 시각적 테스트 플랫폼으로는 대하지 마세요.
가장 날카로운 운영상의 위험은 Docker 렌더링입니다. 두 이슈, Docker에서의 흰 화면 또는 잘린 스크린샷(#1156) 와 Docker v5.3.0 업그레이드 후의 일관되지 않은 결과(#1303)가 몇 년째 해결되지 않은 채 열려 있습니다. Docker는 동시에, 머신 간 렌더링을 정규화하기 때문에 바로 CI에 원하는 것이기도 합니다. 그래서 가장 많은 통제를 주는 도구가, 당신이 바로 그것을 실행할 구성에서, 알려져 있고 미수정된 불안정성의 부류도 함께 건네줍니다. 그것은 계획 가능한 위험이지 결정적 결함은 아니지만, 약속하기 전에 테이블 위에 올려 둬야 합니다.
프로 팁: OS 간 베이스라인 함정. 개발자들이 macOS에서 베이스라인을 잡고 CI 러너가 Linux라면, 실제 회귀가 존재하기도 전에 폰트 앤티앨리어싱 차이만으로 테스트가 떨어집니다. 한 실무자가 기록한것처럼, 폰트 렌더링은 CI 서비스에서 쓰는 Linux 이미지와 로컬 macOS 머신 사이에서 다르며, 시각적 테스트가 그 자체로 떨어지기에 충분할 정도입니다. 해결책은 베이스라인을 하나의 환경에서 생성하고 비교하는 것(CI에서 쓰는 것과 같은 Docker 이미지 안에서 BackstopJS를 로컬로 실행)으로, 참조 이미지와 비교 이미지가 동일한 렌더링에서 나오도록 하는 것입니다.
Argos: 최고의 워크플로, 하지만 실제로는 SaaS
Argos는 BackstopJS가 해내지 못하는 방식으로 리뷰 경험을 제대로 잡아내며, 그것이 셀프 호스팅 유의점에도 불구하고 이 목록에 있는 이유 전부입니다. Playwright, Cypress, Storybook, WebdriverIO, Puppeteer와 통합되고 GitHub Actions, GitLab CI, Bitbucket, Azure DevOps에 연결됩니다. PR 리뷰 워크플로는 일급 제품 표면이며 계속 움직여 왔습니다. 최근의 changelog 항목 들은 고정된 코멘트가 있는 공동 리뷰(2026년 6월)와 불안정한 변경의 자동 무시를 추가합니다.
가장 흥미로운 기술적 차별점은 비교입니다. 결정론적 픽셀 비교 위에 Argos는 2025년 11월 4일 자사 Playwright SDK를 위한 ARIA 스냅샷 비교를 추가했습니다. ARIA 스냅샷 비교는 접근성 트리(역할, 레이블, 구조)를 픽셀 스크린샷과 나란히 비교하여, 순수 픽셀 비교가 놓칠 수 있는 부류의 의미적·접근성 회귀(예: 여전히 똑같아 보이지만 접근 가능한 레이블을 잃은 버튼)를 잡아냅니다. 접근성 약속이 있는 팀에게 이것은 픽셀 전용 도구가 제공하지 않는 진짜 기능입니다.
그다음 제약이 옵니다. 코드는 MIT지만 제품은 관리형 서비스이고, 메인테이너는 셀프 호스팅이 문서화되지 않았고 지원되지 않는다고 명확히 했습니다. 소스에서 세울 수는 있습니다. 다만 상류의 어떤 변경이든 배포를 깨뜨릴 수 있고 아무도 도울 의무가 없다는 것을 알고서 하는 것입니다. 단언하기보다 짚어 둘 가치가 있는 관련 불확실성이 있습니다. 커뮤니티 보고는 GitLab Self-Managed 통합이 Enterprise 플랜을 기대함을 시사합니다(저는 이를 확인된 사양이 아니라 커뮤니티 신호로 취급하니, 결정을 좌우하기 전에 당신 자신의 구성에서 확인하세요).
이는 불편한 간극을 낳습니다. 엄격한 프라이버시 요건을 가진 팀(바로 셀프 호스팅 동기가 가장 강한 팀)이 Argos의 리뷰 경험도 원한다면 좋은 길이 없습니다. 관리형 서비스를 쓰고 제3자 의존성을 받아들이거나, 지원 없이 셀프 호스팅하거나, 다른 도구를 고를 수 있습니다. 깔끔한 네 번째 문은 없으며, 오픈소스 라이선스가 그것을 닫는 척하기보다 그것을 명명하는 편이 더 정직합니다.
이 섹션의 핵심: Argos가 더 강력한 도구입니다. 그것을 셀프 호스팅하는 것은 지원되지 않고 운영상 취약합니다.
Lost Pixel: 아카이브됨, 그리고 쓰고 있다면 할 일
Lost Pixel 리포지토리 자체의 배너 가 그 이야기 전부를 한 줄로 말합니다. 리포지토리는 2026년 4월 22일 소유자에 의해 아카이브되었고 이제 읽기 전용입니다. 팀은 Figma에 합류했고, 마지막 릴리스는 2024년 11월의 v3.22.0이며, 어떤 마이그레이션 안내도 게시되지 않았습니다.
아카이브 전까지 Lost Pixel은 합리적인 선택이었습니다(Docker 기반 렌더링, Playwright와 Storybook 지원에 더해 Ladle과 Histoire, 그리고 전체 페이지와 컴포넌트 단위 양쪽의 시각적 테스트). 그 어느 것도 4월 22일에 기술적으로 바뀌지 않았습니다. 바뀐 것은 이제 메인테이너가 없고, 보안 패치가 없고, 로드맵이 없다는 점이며, 이는 CI 의존물에게는 현재 버전이 아무리 잘 돌아가더라도 새 작업에 대해 실격을 의미합니다.
오늘 그것을 쓰고 있다면, 마이그레이션은 어떻게 썼는지에 따라 나뉩니다. 컴포넌트 단위 테스트, 특히 Storybook이나 Ladle 워크플로에 의존했다면, 가장 가까운 대체는 Argos 관리형 서비스나 Playwright의 네이티브 스크린샷 테스트입니다. BackstopJS는 셀렉터나 Storybook URL을 캡처할 수 있지만, Lost Pixel이 준 것과 같은 내장 컴포넌트 워크플로를 주지는 않으므로, 그 컴포넌트 상태들을 직접 모델링해야 합니다. 전체 페이지 시각적 회귀에 썼다면 BackstopJS가 직접적인 셀프 호스팅형 후계자입니다. 어느 쪽이든 이동은 "당신의 빌드가 내일 깨진다"는 의미에서 급하지는 않지만 시계는 돌고 있습니다. 유지보수되지 않는 테스트 도구는 당신의 브라우저, OS, 프레임워크 버전이 그것이 마지막으로 빌드된 대상에서 멀어질수록 조용히 썩어 갑니다.
한눈에 보는 비교
CI 결정에 중요한 축들을 당신 자신의 제약에 대입하기 전에 훑어볼 수 있도록, 같은 정보를 나란히 놓은 것입니다.
| 축 | BackstopJS | Argos | Lost Pixel |
|---|---|---|---|
| 라이선스 | MIT | MIT 코드, 관리형 SaaS 제품 | MIT |
| 셀프 호스팅의 실상 | 설계상 완전히 셀프 호스팅 가능 | 가능하지만 지원 없음·문서 없음 | 셀프 호스팅 가능했으나 이제 아카이브됨 |
| 유지보수 상태 | 유지보수됨, 느리게 진행되고 성숙함 | 활성(관리형 서비스) | 2026년 4월 22일 아카이브됨 |
| 비교 방식 | 픽셀 비교(Resemble.js) | 픽셀 비교에 ARIA 스냅샷 비교를 더한 것 | 픽셀 비교(유지보수 안 됨) |
| 프레임워크 및 엔진 지원 | Puppeteer(기본), Playwright | Playwright, Cypress, Storybook, WebdriverIO, Puppeteer | Playwright, Storybook, Ladle, Histoire(아카이브 시점) |
| 리뷰 워크플로 | HTML 리포트, 수동 승인, PR 게이트 없음 | PR 리뷰, 공동 코멘트, PR 게이팅 | 해당 없음(아카이브됨) |
| 비용 | 무료 | SaaS 요금(스냅샷 기준) | 무료지만 유지보수 안 됨 |
고르는 법(의사결정 프레임워크)
기능 목록이 아니라 가장 힘든 제약에서 시작하세요. 제약이 메뉴의 대부분을 당신 대신 지워 줍니다.
- 완전히 셀프 호스팅, 예산 0, 그리고 수동 리뷰로 전체 페이지 전용 테스트를 받아들일 수 있는 경우: BackstopJS. 셀프 호스팅, 유지보수됨, 무료를 동시에 충족하는 유일한 옵션이며, 절충점(PR 게이트 없음, JSON 설정, Docker 불안정성)은 그 주위로 설계할 수 있는 알려진 양입니다.
- 최고의 리뷰 경험, PR 게이팅, ARIA 비교를 원하고 SaaS 의존성을 받아들일 수 있는 경우: Argos 관리형 서비스. 이것은 지원되지 않는 셀프 호스팅의 위험 없이 Argos의 강점에 이르는 길입니다. 컴플라이언스 규칙이 제3자로의 스크린샷 업로드를 금지한다면 이 문은 닫혀 있고 당신은 BackstopJS로 돌아갑니다.
- 작은 테스트 스위트 또는 Playwright 우선: 전용 도구를 전혀 추가하지 않는 것을 고려하세요. Playwright는
toHaveScreenshot()를 네이티브로 함께 제공하며, 대략 100개 테스트 미만의 스위트라면 그것만으로 충분할 수 있습니다. 한 실무자 가이드 는 전용 도구가 값을 하기 시작하는 변곡점을 대략 그 규모에 둡니다(이를 공식 Playwright 수치가 아니라 업계 관찰로 취급하세요). git의 베이스라인 파일을 관리하는 오버헤드는 그 지점을 넘어 커지며, 바로 거기서 전용 도구가 값을 합니다. - 현재 Lost Pixel 사용 중: 이전 섹션의 구분에 따라 지금 마이그레이션하세요. "아직 작동한다"를 남을 이유로 받아들이지 마세요.
이 모든 도구에 앞서고 그것들보다 오래 남는 유의점이 있습니다. Sparkbox 팀은 여러 해 전에 쓰면서, 엔지니어들이 테스트를 실제로 쓰게 만드는 것이 설정보다 더 어려웠기 때문에 일부러 호스팅형 옵션을 골랐습니다. 리뷰 UI가 약한 셀프 호스팅형 도구는 비용에서 이기고 채택에서 질 수 있습니다(당신의 팀이 시끄러운 BackstopJS 리포트를 무시한다면, 그 0의 라이선스 비용은 당신에게 아무것도 가져다주지 않은 것입니다). 가격뿐 아니라 리뷰 경험을 결정에 반영하세요.
이 섹션의 핵심: 제약이 도구를 고릅니다. 셀프 호스팅이고 무료면 BackstopJS를, 최고의 워크플로에 SaaS 수용 가능하면 Argos를 가리키며, 작고 Playwright 우선이면 아예 도구가 없음을 가리킬 수도 있습니다.
헤드리스 Chromium을 위한 CI 러너 크기 정하기
세 도구 모두 헤드리스 Chromium을 구동하며, 러너 크기를 정하는 것은 CPU가 아니라 Chromium의 메모리 사용량입니다. 동시에 도는 각 브라우저 워커가 저마다 몇 기가바이트의 RAM을 원하기 때문입니다. 머신을 너무 작게 잡으면 시각적 테스트가 깔끔하게 실패하지 않습니다. 실행 도중 OOM에 죽고 불안정한 인프라 노이즈로 보고되는데, 이는 디버그하기 최악의 종류의 실패입니다.
대략적인 지침으로, 단단한 숫자가 아니라 병렬도에 따라 잡은 것입니다(실제 사용량은 페이지 복잡도와 병렬로 돌리는 워커 수에 따라 달라집니다).
- 작은 팀 또는 직렬 테스트: 약 2 vCPU / 4 GB RAM이면 CI 데몬 오버헤드를 포함해 단일 헤드리스 Chromium 워커를 감당합니다.
- 팀 단위 CI 사용: 약 4 vCPU / 8 GB RAM이면 대략 2~4개의 병렬 브라우저 워커를 지원하며, 대부분의 팀이 여기에 안착합니다.
- 높은 처리량 또는 큰 스위트: 높은 병렬도를 위해, 또는 시각적 회귀 실행이 다른 CI 작업과 러너를 공유할 때 약 8 vCPU / 16 GB RAM.
스토리지는 조용한 항목입니다. 스크린샷 산출물과 과거 베이스라인은 실행마다 쌓이므로 그 증가를 계획하세요. 베이스라인을 로컬에 보관한다면 넉넉한 스토리지 여유를 두거나, 베이스라인과 산출물을 오브젝트 스토리지로 밀어 러너의 디스크가 제약이 되지 않게 하세요.
이것을 하는 셀프 호스팅형 CI 러너에게 VPS는 자연스러운 호스트입니다. Chromium 워커를 위한 예측 가능하고 전용인 RAM을 원하고, 홈랩 머신은 하드웨어가 이미 있을 때만 말이 되기 때문입니다. 주변 CI 스택도 함께 세운다면, 시각적 테스트 도구 주변의 조각들은 Cloudzy 마켓플레이스의 원클릭 배포입니다. CI 포지를 위한 Gitea, GitLab, Jenkins, Forgejo, 그리고 도구들이 필요로 하는 렌더링 일관성을 위한 Docker. 시각적 회귀 도구 자체는 npm이나 Docker로 그 위에 설치하니, 위 범위에서 크기를 정한 Linux VPS 를 띄우고 거기서 실행하세요. Docker 기반 CI를 엮는다면, Cloudzy의 셀프 호스팅형 GitLab 대안 와 Docker 컨테이너 나열 에 관한 가이드가 인접한 설정을 다룹니다.
자주 묻는 질문
Argos는 셀프 호스팅이 가능한가요?
기술적으로는 가능합니다(코드는 MIT 라이선스). 하지만 메인테이너는 2025년 9월에 Argos가 관리형 서비스 외부에서 실행하는 것에 대해 지원도 문서도 제공하지 않는다고 밝혔습니다. 셀프 호스팅을 지원되지 않고 운영상 취약한 것으로 취급하세요. 상류의 어떤 변경에서든 깨질 수 있고 어떤 메인테이너도 도울 의무가 없습니다. 대부분의 팀에게 관리형 서비스가 Argos의 이점을 얻는 실용적인 방법입니다.
Lost Pixel에 무슨 일이 있었나요?
Lost Pixel은 팀이 Figma에 합류하고 제품을 종료한 2026년 4월 22일에 아카이브되었습니다. 리포지토리는 읽기 전용이고, 마지막 릴리스는 2024년 11월의 v3.22.0이며, 어떤 마이그레이션 안내도 제공되지 않았습니다. 새 작업에는 채택하지 마세요. 쓰고 있다면 BackstopJS(전체 페이지 테스트)나 Argos 및 Playwright 네이티브(컴포넌트 테스트)로의 마이그레이션을 계획하세요.
ARIA 스냅샷 비교란 무엇인가요?
ARIA 스냅샷 비교는 접근성 트리(역할, 레이블, 구조)를 픽셀 스크린샷과 나란히 비교하여, 픽셀 비교만으로는 놓칠 수 있는 의미적·접근성 회귀, 예컨대 시각적으로는 똑같지만 접근 가능한 레이블을 잃은 버튼 같은 것을 잡아냅니다. Argos는 2025년 11월 4일에 이 기능을 추가했습니다.
CI에서 헤드리스 Chromium은 RAM이 얼마나 필요한가요?
단일 직렬 워커는 보통 약 2~4 GB에서 돌고, 동시에 도는 워커는 거기서부터 대략 선형으로 RAM을 확장합니다. 실제 사용량은 페이지 복잡도와 병렬로 돌리는 브라우저 인스턴스 수에 따라 달라지므로, 이 값들을 단단한 숫자가 아니라 지침으로 취급하고, OOM에 죽는 테스트 실행을 피하도록 여유를 남기세요.
BackstopJS는 Playwright를 지원하나요?
예. Puppeteer가 기본 엔진(헤드리스 Chrome)이고, BackstopJS는 chromium, firefox, webkit 전반에서 Playwright도 지원합니다. 엔진은 설정에서 고릅니다.
