ShopTalk 702: Lit-HTML, Implied Target for Popover, and Website Builders
Feb 16, 2026
They debate using lit-html and web components for atomic DOM updates and demo a lit-based popover menu. The conversation explores implied popover targets, anchor-scoped IDs, and CSS custom property transition quirks. They weigh whether Apple should offer Safari virtual machines and practical alternatives for cross-platform testing. The hosts compare website builder tiers and recommend CMS options. Plus a clever Chipotle lunch hack.
AI Snips
Chapters
Transcript
Episode notes
Atomic Updates With Lit-HTML
- Lit-html and related libraries perform atomic updates by marking template locations and only patching changed parts of the DOM.
- Chris Coyier and Dave Rupert note this makes lit-html much faster and more surgical than full-tree re-render approaches.
Use Anchor Scope To Avoid Unique IDs
- Use anchor-scope on container elements to avoid creating unique anchor names for each popover.
- Apply anchor-scope inside web components so internal popovers find their correct anchors automatically.
Popover Implied Anchor Simplifies Positioning
- Popovers have an implied anchor when opened, so CSS anchor-position can position them relative to the opener without explicit position-anchor values.
- Removing UA centering (margin:auto) lets the popover naturally anchor to its opener.