How can I tell when the browser stops repainting DOM layers/nodes because they are obscured?

Question

Identification: I\'m looking at all possible solutions for detecting when the FPS drop or the repaints/reflows stop happening in a browser due to the browser op

Answer 1

Regarding what you wrote about requestAnimationFrame:

Also, because raf is only attached at the window level, it is unable to be tied to specific dom nodes

You can (in theory) have the code running in an iframe, therefore the window object is the whole element, or a 1px iframe could be a point on your content.

I have got this working in Firefox by looking at mozPaintCount (as you said and as @alexK85 suggests in their answer) to see if there has been a repaint after CSS change (browser does not do repaint immediately after CSS change when iframe out of viewport). But, I have not yet been able to do a similar thing with requestAnimationFrame in other browsers to establish if there has been a repaint of the iframe immediately after CSS change.

Does anyone have any suggestions about how raf could be used to establish if the browser does a repaint?