Simple search engine with javascript. Any suggestion?

Question

I would to make a simple search engine with javascript. The idea is to read a server-side text file, parse it and find any expression that matches user's query. And yes, I must use client-side scripting.

Do you have any suggestion?

Thanks.

EDIT - Details to answer comments

I need to parse 1 single file (max. 10.000 lines). I do not need an auto-complete: I just want to display strings matching query in a SELECT element. Also, I would like to avoid using JQuery if possible.

Answer 1

You will have cross browser problems with the request so using a library that abstracts this IS a smart choice. However here is a possible skeleton for the needed calls.

Be assured that storing a large file in a javascript variable is not very cleaver. Beware on what you are doing!

var words = [];
var query = "";

function parseText(data) {
 // taking care of data
 // check null handle errors
 var data = data.replace(/\W+/g,' '); // replace non words with spaces
 words = data.split(' '); // split and cache this if you need it again without refetching
 doSearch(query);
}

function doSearch(query) {
  // handle the loop trough the array
  // you may save the data into a variable and use regex instead of splitting into an array
}

function handler() {
 if(this.readyState == 4 && this.status == 200) {
  // so far so good
  if(this.responseXML != null && this.responseXML != "")
     // success!
   parseText(this.responseXML);
  else
   parseText(null);
 } else if (this.readyState == 4 && this.status != 200) {
  // fetched the wrong page or network error...
  parseText(null);
 }
}

query = "someword";
var client = new XMLHttpRequest();
client.onreadystatechange = handler;
client.open("GET", "/remote.txt");
client.send();

Answer 2

If I understood you correctly you need autocomplete. For jQuery I could recommend this one .

Answer 3

Some general recommendations:

• If you don't want to use jQuery or similar libraries, use a (micro)library of your choice (eg. moo.ajax (disclaimer: I've never used this, no guarantees, yada yada)) to at least abstract the AJAX request for the textfile. Don't be tempted to think it's trivial to write your own, and have it work cross-browser.
• If you want to optimize for speed, use a trie or similar structure to keep track of the strings. For 10,000 lines with reasonable entropy (ie not completely random data), the memory requirements for this hopefully aren't a problem. You may want to ignore small queries (ie fewer than 3 characters or the like).
• If you want to optimize for memory usage, only store the list of strings in memory as an array, and use a simple loop and indexOf or regular expression (keep in mind /foo/.test(str) is faster than str.match(/foo/) .) testing to get the list of matching strings.
• Use innerHTML writing on the select element, and string concatenation to generate the <options> . Manipulating thousands of DOM elements tends to be much slower. Make sure to HTML escape the values, and be aware you may lose selected state (and scroll position) in the list, in case that is important for your application.

Hope that helps!