​
Media Preload

Pre-cache media assets so they display or play instantly when triggered. No loading delay for your viewers.

​
SBCanvas.media.preload

await SBCanvas.media.preload('/alerts/follow.webm');
await SBCanvas.media.preload('/sounds/ding.mp3');
await SBCanvas.media.preload('/images/banner.png');
Returns Promise<void> — resolves when the asset is cached and ready for playback.

​
Batch Preload on Ready

SBCanvas.ready(async () => {
  const assets = [
    '/alerts/follow.webm',
    '/alerts/sub.webm',
    '/alerts/tip.webm',
    '/sounds/notification.mp3',
    '/sounds/coins.mp3'
  ];

  await Promise.all(assets.map(url => SBCanvas.media.preload(url)));
  console.log('All assets cached');
});

​
Preloading Field-Driven Assets

SBCanvas.ready(async () => {
  const fields = SBCanvas.getFieldData();
  const urls = [fields.alert_video, fields.alert_sound].filter(Boolean);

  await Promise.all(urls.map(url => SBCanvas.media.preload(url)));
});

​
When to Preload

Preload assets you know will be needed soon:
  • Alert videos and sounds (preload on widget ready)
  • Images referenced in alert sequences
  • Audio clips used in media sequences
Don’t preload everything upfront if your widget has dozens of possible sounds — preload the common ones and let rare ones load on demand.

​
API Reference

MethodReturnsDescription
media.preload(url)Promise<void>Cache a media asset for instant playback