From effc8fed5815ee0ab187c297bcada413b2450959 Mon Sep 17 00:00:00 2001
From: Josh Lee <jleedev@gmail.com>
Date: Sat, 9 Jan 2021 18:21:37 +0000
Subject: [PATCH] Debounce input events in the preset list.

On a slow machine, the preset list is painfully slow to search, as it
rerenders the list on every keystroke, which takes several hundred
milliseconds. By debouncing this, it is able to keep up.

Performance analysis:

Before: Typing the word 'stream' results in a 2.5s frame according to
Chrome's profiler. Each input event takes between 300 and 600 ms to run.

After: Typing the word 'stream' results in three 300ms frames. The first
and last input events take around 200ms, while the four in the middle
are ignored by the debouncer.
---
 modules/ui/preset_list.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/modules/ui/preset_list.js b/modules/ui/preset_list.js
index 38468c53d..84a833c76 100644
--- a/modules/ui/preset_list.js
+++ b/modules/ui/preset_list.js
@@ -1,5 +1,6 @@
 import { dispatch as d3_dispatch } from 'd3-dispatch';
 import { select as d3_select } from 'd3-selection';
+import _debounce from 'lodash-es/debounce';
 
 import { presetManager } from '../presets';
 import { t, localizer } from '../core/localizer';
@@ -122,7 +123,7 @@ export function uiPresetList(context) {
             .call(utilNoAuto)
             .on('keydown', initialKeydown)
             .on('keypress', keypress)
-            .on('input', inputevent);
+            .on('input', _debounce(inputevent));
 
         if (_autofocus) {
             search.node().focus();