> ## Documentation Index
> Fetch the complete documentation index at: https://docs.moss.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Browser Extension Context

> Run indexing and queries in the browser with the @moss-dev/moss-web SDK.

Run indexing and queries inside a browser extension using the
[`@moss-dev/moss-web`](/docs/reference/browser/api) SDK. The background service worker hosts
the Moss client and the index; content scripts message the worker to run queries. The index
persists in extension storage or IndexedDB, so queries resolve in the browser without a
network call and the indexed data stays in the browser.

A million 256-dimension vectors compress to roughly 500 MB; most extensions need far less.

## Architecture

<div className="docs-diagram-frame">
  <img src="https://mintcdn.com/moss-afcfb0b6/qKHE-zU1VqxhLNDK/images/diagrams/browser-extension-context-light.svg?fit=max&auto=format&n=qKHE-zU1VqxhLNDK&q=85&s=c0f11ffed86f520216d6163a986d39e3" alt="A browser content script queries a background worker, which owns the Moss client and a local index in IndexedDB or extension storage" className="docs-diagram-wide mint-block dark:mint-hidden" noZoom width="907" height="77" data-path="images/diagrams/browser-extension-context-light.svg" />

  <img src="https://mintcdn.com/moss-afcfb0b6/qKHE-zU1VqxhLNDK/images/diagrams/browser-extension-context-dark.svg?fit=max&auto=format&n=qKHE-zU1VqxhLNDK&q=85&s=92442b9eca1bb9a4c9d927be47a2f01e" alt="A browser content script queries a background worker, which owns the Moss client and a local index in IndexedDB or extension storage" className="docs-diagram-wide mint-hidden dark:mint-block" noZoom width="907" height="77" data-path="images/diagrams/browser-extension-context-dark.svg" />
</div>

* Background service worker hosts a Moss client (use the [browser SDK](/docs/reference/browser/api), `@moss-dev/moss-web`)
* Content scripts post messages to the background worker for index/query
* Persist the index using extension storage or IndexedDB

## Example (background worker)

```ts theme={null}
// background.ts
import { MossClient } from '@moss-dev/moss-web'
const client = new MossClient(process.env.MOSS_PROJECT_ID!, process.env.MOSS_PROJECT_KEY!)

chrome.runtime.onMessage.addListener(async (msg, _sender, sendResponse) => {
  if (msg.type === 'query') {
    await client.loadIndex('ext-context')
    const res = await client.query('ext-context', msg.text, { topK: 3 })
    sendResponse(res)
  }
})
```

## Related

<CardGroup cols={2}>
  <Card title="Browser SDK" icon="globe" href="/docs/reference/browser/api">
    The in-browser `@moss-dev/moss-web` client.
  </Card>

  <Card title="Local embeddings" icon="microchip" href="/docs/build/local-embeddings">
    Embed on-device for privacy.
  </Card>
</CardGroup>