20K products using autocompletion, want to build static javascript files

Question

Instead of me hitting the database each time someone types a character into the search box, I want to create static .js files.

What are some techniques I can use to create static .js files that are basically arrays to load the jquery autocomplete plugin with.

My product sku's look like:

ABC1234  

or

Alpha Beta C 1234

(abc is the short form for the manufacturer name, while 'Alpha Beta C' is the long form, followed by 3-4 numbers).

Answer 1

This is a great use for JSON. Javascript Object Notation. You can just include the JS files and you'll have all your data in objects.

http://www.json.org

var products = [{sku:'aaaa', price: 50}, {sku:'bbbb', price: 60}];

Please check my syntax, it's from memory.

Answer 2

You can also send all remaining possibilities in JSON via an AJAX call only after 2/3 keystrokes and extract the remaining results from that object/array (I don't know if JQuery supports this behaviour). This saves bandwidth, as not your whole database has to be sent to the client, and you don't have to call the database more than once (generally, if the first keys were correct).

I am not sure if your question is also server-side related (nor what server-side technology you use), so just FYI, have a look at PHP's JSON functions (especially json_encode) to read more about it.

Answer 3

You could build a minimised finite state machine (e.g. a DAWG) which contains final nodes for all of your product codes that exist. Then store this in some optimised format in a Javascript string (or a smallish number of strings).

These strings could then be sent compressed to the browser, it would probably not take very long to load.

Then you can traverse the state machine depending on the number of characters already typed in and efficiently find all product codes which start with those characters.

That's how I'd do it anyway.

Or may be just load the whole dictionary because 20k isn't that many. I wrote a Javascript game which loaded a dictionary bigger than that and wasn't a real problem.