Tổng Quan Gemma Gem
Gemma Gem là trợ lý AI cá nhân sống ngay trong trình duyệt của bạn. Nó chạy mô hình Gemma 4 của Google hoàn toàn trên thiết bị với WebGPU — không cần khóa API, không sử dụng đám mây và không có dữ liệu rời khỏi máy của bạn. Có thể đọc trang, nhấp chuột, điền vào form, chạy JavaScript và trả lời câu hỏi về bất kỳ trang web nào bạn ghé thăm.
Yêu Cầu
- Chrome với hỗ trợ WebGPU
- ~500MB đĩa cho mô hình E2B, ~1.5GB cho E4B (được lưu trữ sau lần chạy đầu tiên)
Cài Đặt
pnpm install
pnpm buildTải tiện ích mở rộng trong chrome://extensions (chế độ nhà phát triển) từ .output/chrome-mv3-dev/.
Sử Dụng
- Truy cập bất kỳ trang nào.
- Nhấp vào biểu tượng viên ngọc (góc dưới bên phải) để mở chat.
- Đợi mô hình tải (hiển thị tiến độ trên biểu tượng + chat).
- Đặt câu hỏi về trang hoặc yêu cầu thực hiện hành động.
Kiến Trúc
Offscreen Document Service Worker Content Script
(Gemma 4 + Agent Loop) <-> (Message Router) <-> (Chat UI + DOM Tools)
| |
WebGPU inference Screenshot capture
Token streaming JS execution- Offscreen document: Chứa mô hình qua
@huggingface/transformers+ WebGPU. Chạy vòng lặp agent. - Service worker: Điều phối thông điệp giữa script nội dung và tài liệu offscreen. Xử lý
take_screenshotvàrun_javascript. - Content script: Chèn biểu tượng gem + lớp phủ DOM chat. Thực thi công cụ DOM (
read_page_content,click_element,type_text,scroll_page).
Công Cụ
| Tool | Description | Runs in |
|---|---|---|
read_page_content | Đọc văn bản/HTML của trang hoặc một CSS selector | Content script |
take_screenshot | Chụp trang hiển thị dưới dạng PNG | Service worker |
click_element | Nhấp vào một element thông qua CSS selector | Content script |
type_text | Nhập vào input qua CSS selector | Content script |
scroll_page | Cuộn lên/xuống theo pixel | Content script |
run_javascript | Thực thi JS trong ngữ cảnh trang với đầy đủ truy cập DOM | Service worker |
Cài Đặt
Nhấp vào biểu tượng bánh răng trong đầu chat:
- Model: Chuyển đổi giữa Gemma 4 E2B (~500MB) và E4B (~1.5GB). Lựa chọn giữ nguyên giữa các phiên.
- Thinking: Chuyển đổi giữa tư duy nội bộ Gemma 4
- Max iterations: Giới hạn vòng lặp gọi công cụ mỗi yêu cầu
- Clear context: Xóa lịch sử hội thoại cho trang hiện tại
- Disable on this site: Tắt tiện ích mở rộng theo hostname (được lưu giữ)
Phát Triển
pnpm build # Build phát triển (với logging, source maps)
pnpm build:prod # Build sản phẩm (logging tắt, minified)Công Nghệ Sử Dụng
- WXT — Khung công cụ tiện ích mở rộng Chrome (dựa trên Vite)
- @huggingface/transformers — Dự đoán ML trên trình duyệt
- marked — Render Markdown trong chat
- Gemma 4 E2B / E4B (
onnx-community/gemma-4-E2B-it-ONNX,onnx-community/gemma-4-E4B-it-ONNX) — lượng hóa q4f16, ngữ cảnh 128K
Ghi Chú
Thư mục agent/ không có bất kỳ phụ thuộc nào. Nó định nghĩa các giao diện (ModelBackend, ToolExecutor) và có thể được chiết xuất thành một thư viện độc lập.
Giới Thiệu
Gemma Gem chạy mô hình Gemma 4 của Google hoàn toàn trên thiết bị qua WebGPU — không cần khóa API, không sử dụng đám mây, không có dữ liệu rời khỏi máy của bạn.