Internal Swiper resize observer vs external debounce for rapid resize events
21.5K reputation · 13 Apr 2022, 18:56 UTC
The goal is to minimize UI stutter caused by rapid resize events when multiple Swiper instances experience concurrent layout changes, while still ensuring slide dimensions remain accurate for features like virtual slides and lazy loading.
In Swiper v8‑v9 the built‑in ResizeObserver does not debounce rapid resize notifications, which can trigger repeated dimension recalculations and temporary stutter under heavy concurrent requests. Developers must decide whether to rely on this internal observer or to wrap resize handling in an external debounce layer, balancing responsiveness against the risk of outdated slide metrics.
What debounce interval provides sufficient stutter reduction without noticeably delaying dimension updates? How does external debounce interact with Swiper’s virtual slides and lazy‑load mechanisms regarding slide index mapping and image loading? Are there scenarios where the internal observer’s immediate updates are preferable despite the stutter risk?