Highlighter can't keep up with animated nodes

NEW
Unassigned

Status

P3
normal
4 years ago
4 months ago

People

(Reporter: pbro, Unassigned)

Tracking

(Blocks: 1 bug)

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [btpp-backlog][designer-tools])

(Reporter)

Description

4 years ago
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.
Bug triage. Filter on CLIMBING SHOES
Priority: -- → P3
Whiteboard: [btpp-backlog]
Blocks: 1333358
Whiteboard: [btpp-backlog] → [btpp-backlog][designer-tools]

Updated

4 months ago
Product: Firefox → DevTools
You need to log in before you can comment on or make changes to this bug.