> For the complete documentation index, see [llms.txt](https://docs.vida.id/identity-stack/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.vida.id/identity-stack/verify/kyc-web-sdk/integration/frontend-integration/asset-preloading.md).

# Asset Preloading

The `preload()` method prepares the SDK in the background so it is ready before your user starts a liveness or identity verification flow.

{% hint style="info" %}
**Availability:** `preload()` is available from **SDK v1.1.3** onwards. Make sure your integration uses v1.1.3 or later before calling it.
{% endhint %}

## Overview

When the SDK starts a verification flow, it needs to download several assets (see What gets prefetched). If these are downloaded only when the flow begins, the user may see a short loading delay.

`preload()` fetches these assets ahead of time and stores them in the browser cache. When the user later reaches the verification screen and your app calls `init()`, the assets are already available, so the flow starts faster.

## When To Use

Call `preload()` on any page your user visits **before** the verification screen - for example a landing page, a consent screen, or a KYC introduction page.

By the time the user reaches the verification flow, the required assets will already be cached in the browser.

{% hint style="info" %}
`preload()` is a new, **optional** method. It does not change your existing integration - `init()`, `destroy()`, and all other SDK methods work exactly as before. You can adopt `preload()` on its own, at any time.
{% endhint %}

## Method Reference

{% code expandable="true" %}

```javascript
VidaSDK.preload();
```

{% endcode %}

<table><thead><tr><th width="234.890625">Property</th><th>Value</th></tr></thead><tbody><tr><td>Parameters</td><td>None</td></tr><tr><td>Returns</td><td><code>void</code></td></tr><tr><td>Auth required</td><td>No - can be called without a token or signing key</td></tr></tbody></table>

## Usage

### CDN

{% code expandable="true" %}

```html
<script src="https://web-sdk.vida.id/<VERSION>/vida-web-sdk.js"></script>
<script>
  VidaSDK.preload();
</script>
```

{% endcode %}

Replace `<VERSION>` with the SDK version you are using (v1.1.3 or later).

### NPM

{% code expandable="true" %}

```javascript
import { VidaSDK } from 'vida-web-sdk';

VidaSDK.preload();
```

{% endcode %}

## What Gets Prefetched

<table><thead><tr><th width="220.9375">Asset</th><th>Description</th></tr></thead><tbody><tr><td>WASM binary</td><td>Vision runtime. The correct variant for the user's device is selected automatically.</td></tr><tr><td>JS glue file</td><td>JavaScript loader that starts the WASM binary.</td></tr><tr><td>Face detection model</td><td>Machine learning model used for face detection and landmark extraction.</td></tr></tbody></table>

## Behaviour Notes

* **Optional.** If you do not call `preload()`, the SDK downloads its assets on demand when the verification flow starts. Everything still works — the flow may just take slightly longer to appear.
* **Safe to call multiple times.** Calling `preload()` more than once does not create duplicate downloads.
* **Non-blocking.** Assets are fetched using `<link rel="prefetch">`, which loads at low priority and does not slow down or block your page.
