[wp-trac] [WordPress Trac] #38911: Prevent Media Library search making an AJAX request for each char typed.

[WordPress Trac]

#38911: Prevent Media Library search making an AJAX request for each char typed.
-------------------------+-------------------------------------------------
 Reporter:               |       Owner:  adamsilverstein
  brandomeniconi         |      Status:  assigned
     Type:  enhancement  |   Milestone:  Awaiting Review
 Priority:  normal       |     Version:  4.6.1
Component:  Media        |  Resolution:
 Severity:  normal       |     Focuses:  javascript, administration,
 Keywords:  has-patch    |  performance
-------------------------+-------------------------------------------------

Comment (by adamsilverstein):

 Replying to [comment:6 joemcgill]:
 > [attachment:38911.diff] Looks pretty good, though the debounce time of
 500ms feels a bit slow to me. I would target somewhere around 200-300ms
 for this interaction.

 @joemcgill Thanks for the feedback! I agree  - it feels a little slow to
 me as well.

 I chose 500 after checking to see what we do elsewhere with ajax search
 boxes,  see [https://core.trac.wordpress.org/browser/tags/4.7/src/wp-
 admin/js/customize-nav-menus.js#L194 customize-nav-menus.js],
 [https://core.trac.wordpress.org/browser/tags/4.7/src/wp-
 admin/js/theme.js#L1345 themes.js] ,
 [https://core.trac.wordpress.org/browser/tags/4.7/src/wp-
 admin/js/updates.js#L2139 updates.js]. Core is somewhat inconsistent - I
 also found some spots where we used 250 (widgets) and 1000 (media grid). I
 read somewhere recently (I can't seem to find now) that the ''average''
 user pauses something like 400ms between keystrokes, I think that is the
 reason we chose to use 500.

 >
 > Also, it looks like the `search` and `change` handlers were added by
 @koop in [22533] to "properly capture clearing the search box", but I'm
 not seeing any side affects when these are removed. @adamsilverstein were
 you seeing other side affects by leaving the extra handlers in?

 Before the debounce I was seeing the the event fire ''multiple'' times per
 keystroke as the duplicate events were fired. Although the debounce fixes
 that, we can still remove the`change` and `search` event handlers -
 `keyup` and `input` should cover all supported browsers and we use them in
 the three examples I linked above.

--
Ticket URL: <https://core.trac.wordpress.org/ticket/38911#comment:7>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform