Slider Control: Fixing the lag

[balazsbajorics]

Problem:
For projects with really bad performance, the slider control would oddly lag behind the canvas and the number control.

Note how the slider control doesn't update while the number control and the canvas do update

Diagnosis:
The slider control uses a local state to store the drag's current value. Probably because our dispatch internally uses a flushSync, this local state update was treated with a lower priority in React, and because the frame times are egregious, it never got enough idle time for a requestIdleCallback.

Fix:

note how the slider updates the same time as the number control and the canvas

By wrapping the local state update into a flushSync block, I managed to force it to update with the same priority as the rest of the editor.
Note: The frame times are still egregious, but that's a different problem.

Fixes #6009

[github-actions]

Try me

[relativeci]

#13338 Bundle Size — 62.66MiB (~+0.01%).

140c7b8(current) vs 6339ece master#13335(baseline)

Warning

Bundle contains 70 duplicate packages – View duplicate packages

Bundle metrics   2 changes 1 regression

	Current #13338	Baseline #13335
Initial JS	45.71MiB(~+0.01%)	45.71MiB
Initial CSS	0B	0B
Cache Invalidation	22.28%	24.14%
Chunks	30	30
Assets	33	33
Modules	4374	4374
Duplicate Modules	524	524
Duplicate Code	31.7%	31.7%
Packages	469	469
Duplicate Packages	70	70

Bundle size by type   2 changes 1 regression 1 improvement

	Current #13338	Baseline #13335
JS	62.64MiB (~+0.01%)	62.64MiB
HTML	11.16KiB (-0.33%)	11.2KiB

---

Bundle analysis report Branch fix/slider-control-lag Project dashboard