크롬 확장용 Transformers.js

Manifest V3 제약 아래 Transformers.js를 크롬 확장에 붙이는 아키텍처를 정리한다.

• background service worker가 모델 호스팅, 에이전트 상태, 툴 실행을 맡는다.
• side panel은 채팅 UI와 스트리밍 응답을 처리한다.
• content script는 페이지 추출과 하이라이트를 담당한다.

모델은 두 갈래로 나뉜다. Gemma 4 E2B ONNX는 텍스트 생성과 도구 선택을, all-MiniLM-L6-v2 ONNX는 검색용 임베딩을 맡는다. 인퍼런스는 모두 background에서 실행되고, 캐시는 chrome-extension:// 오리진에 공유 저장돼 중복 로드를 줄인다. 서비스 워커가 중단될 수 있으므로 모델 상태는 재초기화 가능한 형태로 다뤄야 한다.

실행 루프는 모델 출력의 tool_call을 파싱해 결정적 도구 실행으로 바꾸는 방식이다. webMcp가 확장 도구를 name / description / inputSchema / execute 형태로 정규화하고, extractToolCalls가 메시지와 툴 호출을 분리한다. 예시 도구는 탭 제어, URL 열기, 히스토리 검색, 웹페이지 질의, 요소 하이라이트 등이다.

상태는 용도별로 분리한다.

• 대화 내역: background 메모리
• 설정: chrome.storage.local
• 벡터 히스토리: IndexedDB
• 페이지 콘텐츠: background 캐시

핵심은 로컬 AI 확장에서 배경 실행기 중심 구조, 엄격한 메시징 계약, 모델 캐시 전략이 필요하다는 점이다.