CODEWITHSUNDEEP
javascriptjquerycachingautocomplete
Jason Wells
Jason Wells

Reputation: 889

jQuery Autocomplete Performance

I've implemented the jQuery UI Autocomplete function and am having noticible performance issues.

Originally, I had it sending a new query on each character which is entered (but minimum 3 must be entered).

My database is indexed, has 50k rows of data (5 columns). I have no performance issues at the DB level.

One technique I decided to try was to cache the JSON and point autocomplete to that versus the database. This worked perfect... up to 2000 rows or so. Beyond that, it become slow and wonky.

If anyone has a recommendation on techniques I would appreciate it.

Here's some code to give you an idea of the Javascript.

// First, setup some data to iterate over. 
// My thought is to query the DB once, and build this list in memory to avoid autocomplete hitting the database each keystroke.        

var data = []; 
    data.push({value: "Person 1", label: "Person 1"});
    data.push({value: "Person 2", label: "Person 2"});

$("#searchBox").autocomplete({
    source: data;
    minChars: 3;
    delay: 0;
});

Upvotes: 1

Views: 3591

Answers (2)

olegarch
olegarch

Reputation: 3891

I don't use any DB on server side, all indexes stored in the flat files, and to client sending "answer window" only.

You can use my solution, take source here: http://enumer.org/ac-dist.tgz

This works very quick, an handles huge dictionaries: 10M+ records OK.

Works under Apache WEB-server, with FastCGI module on Unix like OS. My demo works on the old machine: Celeron-300 DeskPro, and this hardware is enough for work as quick as you see.

Server part written on C++, client: JavaScript+Ajax.

Source codes are free upon request.

Upvotes: 0

hollystyles
hollystyles

Reputation: 5039

50k rows !!!! The network is almost certainly your bottleneck. Use TOP or LIMIT (Don't know what db you are using) Surely user is never going to scan 50,000 results just bring back first 10 while they continue typing.

edit

Ah I misread your question, the table has 50k rows, not that you're returning 50k rows Doh! But then you do mention caching 2k rows so... Just limit the results with TOP and work your way up until it gets too slow, find trade off that suits

Upvotes: 2

Related Questions