---
url: https://chartbuddy.io/embed/docs/getting-started/multi-mount.md
---
# Single vs multi mounts

ChartBuddy Embed ships in two packaging modes: **multi-mount** and **single-mount**. Multi-mount is the normal package for pages that can load ChartBuddy’s engine assets and host one or more charts. Single-mount is an all-in-one script for hosts that cannot fetch any further JavaScript after the first file.

**Multi-mount is the default.** Use it for dashboards and normal HTML/app pages. Reach for **single-mount** only when the host is constrained (for example an AI chat artifact window).

## Multi-mount (default)

A normal page or dashboard: you control the host, so ChartBuddy can load its engine assets and you can put **several Insights** on one page.

* Prefer the **multi-file** package (`@chartbuddy.io/embed` / `chartbuddy-embed.mjs`) on sites you control — see [Installation](/getting-started/installation#single-file-vs-multi-file).
* Construct **one `Insight` per container**.
* Pass a stable **`instanceId`** so each chart has a stable registry key. Duplicate ids on the same page **throw**.

```html
<div id="a" style="height:300px"></div>
<div id="b" style="height:300px"></div>
<script type="module">
  import { Insight, snapshotInsights } from 'https://unpkg.com/@chartbuddy.io/embed';

  const a = new Insight('#a', {
    instanceId: 'revenue',
    chartData: chartA,
  });
  const b = new Insight('#b', {
    instanceId: 'bridge',
    chartData: chartB,
  });
  await Promise.all([a.ready, b.ready]);

  // Agent: await snapshotInsights() → { charts: { revenue, bridge } }
</script>
```

Update with `setData` / `update` / `setChartData` on the instance you own. Destroy before removing the element.

Live registry: `window.__CHARTBUDDY_INSIGHTS__` / `getInsights()`.

See the [dashboard sample](/samples/dashboard).

## Single-mount (constrained hosts)

Use single-mount when the environment only allows **one self-contained script** and cannot fetch sibling engine files afterward. Typical cases:

* AI chat / artifact sandboxes
* Strict CSP or single-script embeds

In those hosts:

* Use the **single-file** build (`https://unpkg.com/@chartbuddy.io/embed` or `chartbuddy-embed.single.mjs`). Do not pass `assetBase`.
* Usually mount **one** Insight for the deliverable.
* Keep view mode unless you deliberately want in-artifact editing. See [Connect AI](/connect-ai/) for client-specific notes.

```html
<div id="chart" style="width:100%;height:420px"></div>
<script type="module">
  import { Insight } from 'https://unpkg.com/@chartbuddy.io/embed';

  const insight = new Insight('#chart', {
    persist: false,
    chartData: { /* … */ },
  });
  await insight.ready;
</script>
```

If you are building a dashboard you control, stay on **multi-mount**. Reach for single-mount only when the host forces a one-script, no-extra-JS setup.