CONNECT WITH US
AI & Deeptech

AI & Deeptech

How to Use Transformers.js in a Chrome Extension

Hugging Face logo

Published on

Add as a preferred source on Google
How to Use Transformers.js in a Chrome Extension

While building it, we ran into several practical observations about Manifest V3 runtimes, model loading, and messaging that are worth sharing.

This guide is for developers who want to run local AI features in a Chrome extension with Transformers.js under Manifest V3 constraints.

By the end, you will have the same architecture used in this project: a background service worker that hosts models, a side panel chat UI, and a content script for page-level actions.

In this guide, we will recreate the core architecture of Transformers.js Gemma 4 Browser Assistant, using the published extension as a reference and the open-source codebase as the implementation map.

Before diving in, a quick scope note: I will not go deep on the React UI layer or Vite build configuration. The focus here is the high-level architecture decisions: what runs in each Chrome runtime and how those pieces are orchestrated.

If Manifest V3 is new to you, read this short overview first: What is Manifest V3?.

In MV3, your architecture starts in public/manifest.json. This project defines three entry points:

The background service worker also handles chrome.action.onClicked to open the side panel for the active tab. Related entry point to know: a popup can be defined with action.default_popup and works well for quick actions. This project uses a side panel for persistent chat, but the orchestration pattern is the same.

The key design decision is to keep heavy orchestration in the background and keep UI/page logic thin.

chatMessages ): the UI sends events like AGENT_GENERATE_TEXT , background appends the message, runs inference, then emits MESSAGES_UPDATE back to the side panel.


Source link
Related Topics:AI & Deeptech

Disclaimer

We strive to uphold the highest ethical standards in all of our reporting and coverage. We TheMorningPulse.fyi want to be transparent with our readers about any potential conflicts of interest that may arise in our work. It's possible that some of the investors we feature may have connections to other businesses, including competitors or companies we write about. However, we want to assure our readers that this will not have any impact on the integrity or impartiality of our reporting. We are committed to delivering accurate, unbiased news and information to our audience, and we will continue to uphold our ethics and principles in all of our work. Thank you for your trust and support.