[GeekNews 요약] Gemma Gem: 브라우저에서 WebGPU로 구동되는 온디바이스 Gemma 4 AI 비서
49
설명
Gemma Gem은 Google의 Gemma 4 모델을 웹 브라우저 내에서 완전 온디바이스로 실행하는 혁신적인 Chrome 확장 프로그램입니다. API 키나 클라우드 연결 없이 사용자의 기기에서 직접 AI 기능을 활용할 수 있어, 데이터 프라이버시와 보안을 극대화합니다. 웹 페이지를 이해하고 상호작용하는 개인 AI 비서를 브라우저에 직접 탑재하고 싶은 개발자 및 IT 독자에게 특히 유용할 것입니다.
### 1. 무엇인가
Gemma Gem은 Google의 Gemma 4 모델을 WebGPU를 통해 브라우저 내에서 완전히 온디바이스로 실행하는 Chrome 확장 프로그램입니다. 이 프로젝트의 핵심은 API 키, 클라우드 연결, 또는 사용자 데이터가 기기를 벗어날 필요 없이 모든 AI 추론이 로컬에서 이루어진다는 점입니다. 이를 통해 사용자는 방문하는 모든 웹사이트에 대해 페이지를 읽고, 버튼을 클릭하고, 양식을 채우고, JavaScript를 실행하며 질문에 답하는 등 개인화된 AI 비서 기능을 경험할 수 있습니다.
### 2. 주요 기능 및 활용
Gemma Gem은 단순히 질문에 답하는 것을 넘어, 웹 페이지와 능동적으로 상호작용하는 다양한 기능을 제공합니다. 페이지의 텍스트나 HTML을 읽고, CSS 선택자를 통해 특정 요소를 클릭하거나 텍스트를 입력할 수 있습니다. 또한, 페이지 스크롤, 보이는 화면 스크린샷 캡처, 그리고 전체 DOM 접근 권한을 가진 JavaScript 실행 기능까지 갖추고 있어 복잡한 웹 자동화 작업도 가능합니다. 사용자는 이 확장 프로그램을 통해 웹 서핑 중 궁금한 점을 즉시 해결하거나 반복적인 작업을 AI에게 맡길 수 있습니다.
### 3. 아키텍처 및 동작 방식
Gemma Gem은 Offscreen Document, Service Worker, Content Script의 세 가지 주요 구성 요소로 이루어진 아키텍처를 가집니다. Offscreen Document는 @huggingface/transformers와 WebGPU를 활용하여 Gemma 4 모델을 호스팅하고 에이전트 루프를 실행합니다. Service Worker는 Content Script와 Offscreen Document 간의 메시지를 라우팅하며, 스크린샷 캡처 및 JavaScript 실행과 같은 작업을 처리합니다. Content Script는 웹 페이지에 젬 아이콘과 채팅 오버레이를 주입하고, 페이지 콘텐츠 읽기, 요소 클릭, 텍스트 입력, 페이지 스크롤 등 DOM 관련 도구들을 실행합니다.
### 4. 설정 및 개발
사용자는 채팅 헤더의 설정 아이콘을 통해 다양한 옵션을 조정할 수 있습니다. Gemma 4 E2B(~500MB)와 E4B(~1.5GB) 모델 간 전환, AI의 '생각' 과정 토글, 도구 호출 루프의 최대 반복 횟수 설정, 현재 페이지의 대화 기록 초기화, 그리고 특정 호스트 이름에서 확장 프로그램 비활성화 등의 기능이 제공됩니다. 개발자를 위해서는 `pnpm build` 및 `pnpm build:prod` 명령어를 통해 개발 및 프로덕션 빌드를 생성할 수 있으며, `chrome://extensions` 및 `chrome://inspect#other`를 통해 서비스 워커, 오프스크린 문서, 콘텐츠 스크립트의 로그를 상세하게 디버깅할 수 있습니다.
### 가치와 인사이트
Gemma Gem은 온디바이스 AI의 잠재력을 보여주는 중요한 프로젝트입니다. 클라우드 의존성을 제거함으로써 사용자 데이터 프라이버시를 보장하고, API 비용 없이 AI 기능을 활용할 수 있게 합니다. 이는 개인화된 AI 비서가 사용자 기기 내에서 더욱 안전하고 효율적으로 작동할 수 있음을 시사합니다. 특히 웹 자동화, 정보 추출, 개인화된 웹 경험 제공 등 실무에서 다양한 방식으로 활용될 수 있으며, 인터넷 연결이 불안정한 환경에서도 AI 기능을 사용할 수 있다는 장점을 가집니다. 향후 브라우저 기반 AI 애플리케이션 개발의 새로운 방향을 제시할 것으로 기대됩니다.
### 기술·메타
- **프레임워크**: WXT (Chrome 확장 프레임워크, Vite 기반)
- **ML 추론**: @huggingface/transformers (브라우저 ML 추론)
- **마크다운 렌더링**: marked
- **AI 모델**: Google Gemma 4 E2B / E4B (onnx-community/gemma-4-E2B-it-ONNX, q4f16 양자화, 128K 컨텍스트)
- **라이선스**: Apache-2.0
- **기술**: WebGPU, TypeScript, JavaScript, HTML
📝 원문 및 참고
- 원문: [링크 열기](https://github.com/kessler/gemma-gem)
- GeekNews 토픽: [보기](https://news.hada.io/topic?id=28645)
---
출처: GeekNews ([원문 링크](https://github.com/kessler/gemma-gem))
신고 · 불법·유해·아동 안전(CSAE) 관련 콘텐츠
댓글 0
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.