During inspector scrubber interactions (slider control, the scrubbable labels of number controls) switch the inspector store to "real time mode"

[balazsbajorics]

Problem: when dragging a slider control in the component section, or scrubbing a number control using the scrubbing interaction by dragging the label of the number control, the updates are instant on the canvas, but weirdly lag behind on the inspector.

This is casued by the inspector being wrapped in a LowPriorityStore.

Fix: we used to have a fix for this, but I don't remember what it was exactly. The dispatch function takes a (now unread) DispatchPriority prop, which could be set to 'inspector' Or alternatively, an Atom could be flipped that controls the inspector priority urgency.

[seanparsons]

I've tried a few approaches but tellingly when I put an update directly to the input element itself it still felt laggy.

Some other discoveries:

• For more complicated projects the building of the execution scope ends up being quite costly for each change as the require function changes with each change to the project contents.
• The mutation/resize observers in the DOM walker run when there's any slack which means they end up running when there's any slight pause in the scrubbing which could be exacerbating any perceived lag.

[balazsbajorics]

okay so this is where I got so far:

1. indeed horrible performance is making things bad, but
2. weirdly React for some reason yields re-rendering of the slider control, even though in theory it doesn't use Deferred or any other low priority fiber setting, or anything like that. The slider component has a local state! which should update "real time" with the drag and the canvas, but for some reason the re-render is not queued. I need to look into more to understand why. I want to work a bit more on this because I feel like this reveals something about React I don't understand