Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to improve performance of Jquery autocomplete

I was planning to use jquery autocomplete for a site and have implemented a test version. Im now using an ajax call to retrieve a new list of strings for every character input. The problem is that it gets rather slow, 1.5s before the new list is populated. What is the best way to make autocomplete fast? Im using cakephp and just doing a find and with a limit of 10 items.

like image 800
Björn Avatar asked May 03 '09 17:05

Björn


People also ask

How does autocomplete work in jQuery?

In the process of searching a specific value, the jQuery UI autocomplete selection feature provides the user with some string suggestions for the input area which effectively saves time. The autocomplete select action is triggered when the user selects one of the options from the pre-populated list.

What is autocomplete delay?

The autocomplete delay option is a perference which allows users to determine the time it takes for the autocomplete window to be displayed when typing in the query editor. It can be found on the General page of SQLPro Preferences . The default autocomplete delay is 1.25 seconds.

What is jQuery ui autocomplete?

Autocomplete mechanism is frequently used in modern websites to provide the users a list of suggestion while typing the beginning word in the text box. It facilitates the user to select an item from the list, which will be displayed in the input field.


2 Answers

This article - about how flickr does autocomplete is a very good read. I had a few "wow" experiences reading it.

"This widget downloads a list of all of your contacts, in JavaScript, in under 200ms (this is true even for members with 10,000+ contacts). In order to get this level of performance, we had to completely rethink how we send data from the server to the client."

like image 57
cllpse Avatar answered Oct 19 '22 17:10

cllpse


Try preloading your list object instead of doing the query on the fly.

Also the autocomplete has a 300 ms delay by default.
Perhaps remove the delay

$( ".selector" ).autocomplete({ delay: 0 }); 
like image 36
Darren Cato Avatar answered Oct 19 '22 16:10

Darren Cato