1161217 - Highlighter can't keep up with animated nodes

Status: NEW

(DevTools :: Inspector, defect, P3)

Description

[Patrick Brosset <:pbro>]

STR:
- open this page: https://bgrins.github.io/devtools-demos/inspector/animation-timing.html
- open the inspector
- in the markup-view tree, find the #box1 node and put your mouse over it

ER: the box-model highlighter is displayed on the node and "follows" it while it moves.
AR: the box-model highlighter is displayed on the node, "follows" it around, but sometimes lags a little bit behind.

The highlighter uses a requestAnimationFrame loop and at each step of the loop it reads the position of the highlighted node (using node.getBoxQuads) and updates the position of the SVG elements used in the highlighter UI.

So the lag is the time it takes to run the code between the rAF tick and the moment the coordinates are set on the SVG nodes.

This bug is about investigating ways to make that faster.

Comment 1

[Julian Descottes [:jdescottes]]

Bug triage. Filter on CLIMBING SHOES