Whenever the dom changes in height (such as an ad loads and causes layout shift), I need to run a method on element X.
The lightest approaches dom-wise I could think of were resizeObserver or intersectionObserver.
The intersectionObserver solution would permanently observe element X and runs the method when it is on screen. Downside is it'll run every time you scroll past it.
The resizeObserver solution would permanently observe the page's main container (holds all possible shifting elements) for height changes (dom shifting) and then runs the method. Down side is it could run multiple times during the loading of the page, but plus side is it won't run again after that.
Is there a way to test/know which approach is lighter on the dom overall? Because they would both be permanent observers.