광고를 숨기는 대신 ‘OBEY’ 타일로 바꿔버리는 uBO Lite 포크

• uBlock Origin Lite를 포크해서, 광고를 그냥 숨기는 대신 영화 ‘They Live’풍 선전 문구 타일로 바꾸는 확장 프로그램이 나옴

  • 광고 자리에 흰 박스가 생기고, 그 위에 OBEY, CONSUME, WATCH TV, SLEEP, SUBMIT, CONFORM, BUY, NO INDEPENDENT THOUGHT 같은 문구가 랜덤으로 박힘
  • 원작 아이디어는 만든 사람이 2015년에 블로그에 썼던 ‘They Live adblock mode’에서 온 것이라고 함

• 핵심은 uBO Lite의 cosmetic filtering을 살짝 비트는 것임

  • 원래 uBO Lite는 매칭된 광고 요소에 display: none !important 같은 CSS를 주입해서 안 보이게 만듦
  • 이 포크는 그 주입 지점을 패치해서, 요소를 숨기는 대신 흰색 마스크와 ::after 오버레이를 적용함
  • 오버레이 문구는 data-ubol-they-live 속성에서 읽고, DOM을 훑으면서 각 광고 요소에 랜덤 문구를 붙임

• 단, 모든 광고가 ‘OBEY’ 타일로 바뀌는 건 아님

  • uBO Lite의 기본값인 Basic filtering은 네트워크 레벨에서 광고 요청을 막는 방식이라 DOM 요소 자체가 안 생김
  • DOM 요소가 없으면 꾸밀 대상도 없어서, 그냥 일반 광고 차단기처럼 빈 공간만 남음
  • 타일을 보고 싶으면 uBO Lite 대시보드에서 해당 사이트의 필터링 모드를 Optimal 또는 Complete로 올리고 새로고침해야 함

• 설치는 아직 수동 언팩 확장 프로그램 방식임

  • Releases 페이지에서 uBOLite_theylive.chromium.zip을 받고 압축을 푼 뒤, Chrome 계열 브라우저의 chrome://extensions에서 Developer mode를 켜고 Load unpacked로 폴더를 선택함
  • 확장 프로그램은 해당 폴더 경로에서 직접 로드되므로, 압축을 푼 폴더를 지우면 안 됨

• 직접 빌드하려면 Node 22가 필요함

  • 저장소를 --recursive로 클론한 뒤 davmlaw/uBlock 서브모듈 안에서 빌드 스크립트를 돌리는 구조임
  • 예시는 tools/make-mv3.sh chromium이고, 대상은 firefox, edge, safari도 가능하다고 적혀 있음
  • 빌드 결과물은 uBlock/dist/build/uBOLite.chromium/에 생기며, 이것도 unpacked extension으로 로드함

• 건드린 파일도 꽤 명확하게 공개돼 있음

  • 새 파일 platform/mv3/extension/js/scripting/they-live.js에는 문구 목록, CSS 생성기, DOM 태깅 로직이 들어감
  • css-specific, css-generic, procedural-api 쪽 호출부도 패치됨
  • scripting-manager.js에서는 they-live.js를 먼저 등록해서 소비자 코드보다 앞서 동작하게 함

• 주의점도 있음. 이건 공식 uBlock Origin 제품이 아니라 개인 취미 포크임

  • 문제가 생겨도 uBO 쪽에 이슈를 올리면 안 된다고 못 박아둠
  • 원래 숨겨져야 할 요소를 다시 보이게 만드는 방식이라, 사이트 CSS가 광고 슬롯이 접힌다고 가정한 경우 레이아웃이 흔들릴 수 있음
  • 사용자 정의 cosmetic filter는 기존처럼 그냥 숨겨지고, ‘OBEY’ 처리는 적용되지 않음

---

기술 맥락

• 이 프로젝트가 건드린 지점은 광고 차단의 ‘요청 차단’이 아니라 ‘화면 표시’ 레이어예요. 네트워크에서 광고를 막아버리면 DOM에 요소가 안 남기 때문에, 문구 타일로 바꿀 대상 자체가 없거든요.

• 그래서 Basic 모드에서는 기대한 효과가 잘 안 보여요. uBO Lite가 기본적으로 네트워크 차단을 많이 쓰기 때문이고, 이 포크가 재미를 발휘하는 건 CSS로 숨겨지는 cosmetic filtering 영역이에요.

• 구현 방식도 꽤 브라우저 확장답게 현실적이에요. CSS 주입부를 바꿔 흰 박스와 ::after 오버레이를 만들고, MutationObserver로 늦게 붙는 광고 DOM까지 따라가야 동적 페이지에서도 빠지는 광고가 줄어들거든요.

• 개발자 입장에서 볼 만한 포인트는 ‘차단기를 새로 만든 것’이 아니라 기존 uBO Lite 파이프라인의 특정 단계만 바꿨다는 점이에요. 덕분에 필터 매칭 같은 무거운 문제는 그대로 upstream에 맡기고, 표시 방식만 장난스럽게 바꿀 수 있어요.