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

# How It Works

> A small JavaScript snippet loads from our CDN. When a user clicks your quote button, it opens the FMV Accessory Builder in an iframe overlay on your site.

```
Your Website (your domain)
    → FMV Script (cdn.fitmyvehicle.com.au)
        → Builder iframe (cdn.fitmyvehicle.com.au/widget)
            → FMV API (api.fitmyvehicle.com.au)
```

## The two parts

The integration is a 2-part embed:

1. **fmv.js** (\~5 KB, no dependencies) — loaded directly on your page from `cdn.fitmyvehicle.com.au`. This is a lightweight UI shell that creates an overlay and iframe when the user clicks the trigger button.

2. **Widget iframe** — a full-page overlay iframe pointing to `cdn.fitmyvehicle.com.au/widget/`. All API calls, database connections, and data processing happen inside this iframe.

Communication between the iframe and your page uses `postMessage` for close events and optional [analytics events](/configuration/analytics-events). No sensitive customer data crosses the boundary.

## Key details

| Detail              | Value                                                                                                                                                              |
| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Script size         | \~5 KB (vanilla JS, no dependencies)                                                                                                                               |
| Loading             | Asynchronous with `defer` — does not block page rendering                                                                                                          |
| Lazy iframe         | Created only when user clicks — zero impact on initial page load                                                                                                   |
| Time to interactive | \<100ms after script loads                                                                                                                                         |
| Widget iframe load  | \~200–500ms on first open                                                                                                                                          |
| Event delegation    | Uses event delegation on `document`, so trigger buttons work even if added to the DOM after the script loads (Shopify themes, WordPress page builders, SPAs, etc.) |
| Compatibility       | WordPress, Shopify, Wix, Squarespace, custom sites, and any platform that supports HTML                                                                            |

## What the script does and doesn't touch

The embed script (`fmv.js`) reads only its own elements:

* Its own `<script>` tag attributes (`data-public-key`, `data-builder-id`)
* Click targets with `data-fmv-open-widget` (via event delegation)
* `window.location.origin` — passed to the API as the host origin

It creates exactly **2 DOM elements**: a `<div>` overlay and an `<iframe>`. That's it.

It does **not**:

* Read page content, forms, user inputs, or any other DOM elements
* Set cookies or touch localStorage/sessionStorage on your domain
* Send any data from your site anywhere — it's purely a UI shell
* Inject styles that affect your site's appearance
* Load third-party scripts or tracking pixels on your page

<Info>
  FMV emits structured [analytics events](/configuration/analytics-events) via `postMessage` that you can optionally forward to your own tracking (GTM, GA4, etc.). No third-party tracking code is loaded by FMV itself.
</Info>

## Optional performance optimization

Add DNS prefetch hints to your page `<head>` for marginally faster first-open times:

```html theme={null}
<link rel="dns-prefetch" href="//cdn.fitmyvehicle.com.au">
<link rel="preconnect" href="https://cdn.fitmyvehicle.com.au" crossorigin>
```
