SnapDOM keeps internal caches for images, backgrounds, resources, styles and fonts so repeated captures stay fast. The cache option ("disabled", "soft", "auto", "full") controls how much is cleared between captures, and preCache() warms those caches ahead of time so the first capture doesn't stall.
Cache control
SnapDOM maintains internal caches for images, backgrounds, resources, styles, and fonts. You can control how they are cleared between captures using the cache option:
| Mode | Description |
|---|---|
| "disabled" | No cache. |
| "soft" | Clears session caches (styleMap, nodeMap, styleCache) (default). |
| "auto" | Minimal cleanup: only clears transient maps. |
| "full" | Keeps all caches (nothing is cleared, maximum performance). |
Examples:
// Use minimal but fast cache
await snapdom.toPng(el, { cache: 'auto' });
// Keep everything in memory between captures
await snapdom.toPng(el, { cache: 'full' });
// Force a full cleanup on every capture
await snapdom.toPng(el, { cache: 'disabled' });
preCache()
preCache() is an optional helper that preloads external resources to avoid first-capture stalls. It is especially helpful for big or complex trees, where fetching images, backgrounds and fonts on the very first capture would otherwise cause a noticeable pause.
import { preCache } from '@zumer/snapdom';
await preCache({
root: document.body,
embedFonts: true,
localFonts: [{ family: 'Inter', src: '/fonts/Inter.woff2', weight: 400 }],
useProxy: 'https://proxy.corsfix.com/?'
});
preCache() is also available as a lighter subpath import: import { preCache } from '@zumer/snapdom/preCache'.
Ready to capture?
Drop SnapDOM into your project and capture your first element in one line.
Open the demo Install from npm