2025-12-286 min read

How Our Shadow DOM Embed Engine Eliminates Layout Shift

Deep dive into our embed runtime: preventing layout shift with Shadow DOM, smart lazy loading, and total style isolation.

The problem: widgets that break layouts

Most embeds fail in predictable ways:

  • they inject global CSS and fight your theme
  • they load late and cause layout shift (CLS)
  • they ship too much JS for what they do

The GizmoSauce approach

Our embed runtime focuses on three things:

  1. Style isolation via Shadow DOM (so your site can’t accidentally restyle the widget).
  2. CLS-safe rendering by reserving space and avoiding “late” layout changes.
  3. Lazy loading so widgets only hydrate when they’re actually visible.

Try it on a real widget

If you want to see the engine in action, pick a widget and publish it:

And if you’re new to embeds, start with the basics: