sticky: true repaints frequently

Bug description

setting sticky: true and trigger: click on an element, it seems to repaint the document rather frequently, so much so that the dom can’t be edited from dev console.

(This is happening in chrome, but might be happening in other browsers too.)

Reproduction

1. visit https://test-tippy-obddnsfyyn.now.sh/

2. click the button

3. inspect the tippy element

4. notice that various dom elements in the dev console are flickering and un-editable:

[atomiks]

@mreinstein that seems like a good idea, I’ll look into it

[mreinstein]

sticky updating each animation frame fixes those cleanly without needing to check anything.

I get that the static update each frame is very clean. I think the issue though is that updating essentially does 2 things under the hood each frame:

• re-draws the element
• triggers a layout re-flow

For most of those frames, nothing will have changed. I’m wondering if we could useElement.getBoundingClientRect() each frame to detect if the element has changed. That would still trigger layout re-flow, but at least we’re not thrashing the dom with unnecessary re-draws.

https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect