이 글은 Manifest V3 환경에서 Transformers.js를 활용하여 Chrome 확장 프로그램을 개발하는 방법을 안내합니다. 배경 서비스 워커, 사이드 패널 채팅 UI, 콘텐츠 스크립트의 아키텍처를 중심으로 설명합니다.
확장 프로그램은 Gemma 4 E2B 모델을 사용하여 웹 페이지 탐색을 돕고, 배경 서비스 워커에서 모델을 호스팅하며, 사이드 패널은 채팅 UI를 제공하고, 콘텐츠 스크립트는 페이지 요소를 추출합니다.
텍스트 생성 및 벡터 임베딩을 위한 모델을 분리하여 관리하고, 모든 추론은 배경 서비스 워커에서 수행하며, 모델은 확장 프로그램의 원본에서 캐시됩니다. MV3의 서비스 워커 라이프사이클을 고려하여 모델 런타임 상태를 복구 가능하도록 설계해야 합니다.