ResizeObserver loop limits

Summary

ResizeObserver fires when element size changes — infinite loop if callback mutates size synchronously. Browser throws "ResizeObserver loop limit exceeded" and defers — fix feedback loops. Use for container queries polyfills, chart resize — debounce heavy work.

Code example

const ro = new ResizeObserver((entries) => {
  requestAnimationFrame(() => {
    for (const { contentRect } of entries) {
      chart.resize(contentRect.width, contentRect.height);
    }
  });
});
ro.observe(container);

Key points

• ResizeObserver fires when element size changes — infinite loop if callback mutates size synchronously.
• Browser throws "ResizeObserver loop limit exceeded" and defers — fix feedback loops.
• Use for container queries polyfills, chart resize — debounce heavy work.

Further reading

• ResizeObserver
• ResizeObserver loop

Related concepts

• IntersectionObserver internals
• MutationObserver cost