Lazy loading

Videos, 360° panoramas and 3D models are heavy. Loading them eagerly on every page request kills page-speed scores and wastes customer bandwidth. Mediaverse defers loading until the asset enters the viewport — but you can fine-tune the behaviour.

What gets lazy-loaded

Embed iframes (YouTube, Vimeo, etc.) — replaced by a thumbnail + play overlay until the customer clicks play
HTML5 <video> elements — preload="metadata" or preload="none" instead of preload="auto"
360° panoramas — viewer initialises only when the slide is shown
3D models — <model-viewer loading="lazy"> defers loading the model file

Per page-type controls

Lazy loading is toggled per page type:

Settings → Plugins → Mediaverse → Video → Lazy load in listing — category and search grids
Settings → Plugins → Mediaverse → Video → Lazy load in CMS — Shopping Experiences
Product detail pages lazy-load by default; sources listed in Embed → general → Load iframe immediately load eagerly, the rest stay lazy.

Eager loading for specific pages

If a page absolutely needs the iframe to load immediately (e.g. a hero video on a landing page), enable eager loading for that source in Embed → general → Load iframe immediately — separately per page type.

3D model loading modes

<model-viewer> supports four loading modes:

auto — let the browser decide (recommended)
lazy — load only when scrolled into view
eager — load on page request
manual — only load when the customer presses the “Load 3D Model” button

For category pages with many 3D-enabled products, manual is the safest choice — customers explicitly opt in to downloading the model.

Preload settings for HTML5

For local HTML5 videos, preload on the <video> element controls how aggressively the browser fetches content:

auto — preloads the whole video (heavy)
metadata — preloads only dimensions, length, codecs (light)
none — preloads nothing until the customer presses play

Default in Mediaverse is auto — switch to metadata for most use cases.