-
-
Notifications
You must be signed in to change notification settings - Fork 881
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Improve keyboard navigation (move) responsiveness #3531
Improve keyboard navigation (move) responsiveness #3531
Conversation
5deccb2
to
31ab716
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Some refactoring opportunities; logic looks good
} | ||
|
||
let idleCallback; | ||
const requestIdle = window.requestIdleCallback ? |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should probably move this to utils/async.js
(maybe not export it for now, until we need something other than idleThrottle
in module code)
const requestIdle = window.requestIdleCallback ? | ||
window.requestIdleCallback : // XXX Only available in Chrome / Opera | ||
fn => requestAnimationFrame(() => requestAnimationFrame(fn)); // Approximation for "Don't do anything this frame" | ||
const runIdle = callback => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
IIUC this ensures that the callback will only be called once if runIdle
is called multiple times before an idle period.
If so, this abstraction can be exported from async.js
as idleThrottle
(just like frameDebounce
, which should really be "throttle" rather than "debounce").
i.e. we would end up with
const runIdle = idleThrottle(runListeners);
❤️ perf profiles |
31ab716
to
be1ca39
Compare
4d91c88
to
c55a537
Compare
c55a537
to
95f96a1
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Not yet tested
Especially noticeable when using NER.
Before:

After:
