/    Sign up×
Community /Pin to ProfileBookmark

Attempting to write a fast AJAX drop-down menu

Thank you.

I’ve attempted to be as descriptive as I possibly can in my objective to clearly communicate what I am attempting to accomplish. I hope that I can get some valuable feedback to help solve this problem; as it is more of a matter of efficiency than functionality. The main intent of this thread is to seek advice on OPTIMIZATION. Although this mostly has database calls, it belongs in the PHP section because I’m hoping I can optimize the PHP code; or if I have to, break apart the database.

[U][B]Objective[/B] [/U]
to create a AJAX Drop-Down menu like the one located at [url]http://finance.google.com[/url]

[U][B]The problem:[/B][/U]
to create a [I][U]very fast[/U][/I] AJAX drop-down menu querying a database with large amounts of data. The drop-down menu is very slow the way it is, but it works.

[B]Details[/B]
I have over 100,000 entries in my database that my parser will pick up. My simple query takes a very long time to execute; I’m running it on my local machine and it yields a 2-4 second delay.

I have a list of cities, counties, and zip-codes I retrieved from the USPS database (this is accessible for anyone who registered as a developer with them).

I run a simple query on each one of my three tables
SELECT * FROM table WHERE city LIKE (‘$q’) ORDER BY xxx GROUP BY xxx;
SELECT *
FROM table2 WHERE county LIKE (‘$q’)ORDER BY xxx GROUP BY xxx; ;
SELECT * FROM table3 WHERE zip LIKE (‘$q’) ORDER BY xxx GROUP BY xxx;;

I echo the results back to my menu using an AJAX call after all items were iterated through.

[U][B]Solutions I’ve attempted[/B][/U]
1. Limited the amount result set to 8 – IMPROVED MAY 0.2 SECONDS
2. Wrote a static return function to retreive a list of static cities when a certain sequence of letters/numbers are entered. Only after a person has entered in 3 letters I do the query. – IMPROVED 0.5 SECONDS
3. I ordered my database in alphabetical order. I created a separate table to index the start and stop values of all permuations of 2 letter sequences. For instance, if a user would type in “LO” that table will return a range of 2 integers, let’s say 3, and 10. Then I do a double query

SELECT * FROM (SELECT * FROM search_items LIMIT 3, 10) as X ORDER BY x.yyy GROUP BY x.yyy;

This really didn’t do much, but now taxes my MySQL some more.

[I][B]i need your help![/B][/I]
I am looking for more solutions. Basically, how does GOOGLE Finance do it so fast? Can anybody help me come up with a fast way to do it to get it as fast as googles?

Using:
PHP 4.3x
MySQL 4.x

to post a comment
PHP

6 Comments(s)

Copy linkTweet thisAlerts:
@NogDogSep 28.2006 — AJAX Drop-Down menu like the one located at http://finance.google.com[/quote]I don't see any drop-down menus there. ?

very fast AJAX drop-down menu querying a database with large amounts of data[/quote]
I don't know, this sort of sounds like an oxmoron. AJAX immediately is adding overhead you can't really control due to the fact that each action has to send a request across the internet, then wait for the response data before it can complete.

The first obvious place to look at is your database configuration and the SQL you are using. Without knowing the details, it's pretty hard to give any concrete solutions. Certainly the first thing I'd look at is ensuring that table columns which need indexes are, in fact, indexed. And of course it wouldn't hurt to have a high-quality server running your database with a highly skilled (and highly paid) database administrator optimizing the server and the database for you. ?
Copy linkTweet thisAlerts:
@bokehSep 28.2006 — 1, Looking at the query I cant see how LIKE is going to work as there are no wildcards.

2, "[I]static return function[/I]" Two characters should be fine. Only do the AJAX request on a transition from one to two characters. When the third character is entered just use Javascript to narrow down the list. Don't do another call to the DB.

3, Make your queries as simple as possible but that still return useful results and use Javascript to make sense of the results.

4, Do as much processing as possible on the client's machine and avoid multiple requests where they can be avoided.

5, And as stated above optimise your tables and their attributes.

6, Send requests directly to your PHP backend to assess its performance without the Javascript overhead.
Copy linkTweet thisAlerts:
@oomagnumooauthorSep 28.2006 — I don't see any drop-down menus there. ?

[/QUOTE]


They're there. In the finance section, start typing up a ticket symbol that you can think of it. For instance, "GOOG" (for google). The moment you type in G you get a pop down menu. AJAX is fairly efficient. The bottle neck in my algorithm is definitely the database. Yes, AJAX does add overhead, but it is negligible.

To make it absolutely clear, the values I'm doing the query on IS INDEXED 100% sure.

Do as much processing as possible on the client's machine and avoid multiple requests where they can be avoided.[/QUOTE]

I like this idea. When I do a query, I get about 100 returned results. Do you suppose using a client side Link'd List would be alright?

This would be so much easier if I could multi-thread :rolleyes:

1, Looking at the query I cant see how LIKE is going to work as there are no wildcards.[/QUOTE]

My fault. SELECT * FROM table WHERE city LIKE ('$q%');
Copy linkTweet thisAlerts:
@bokehSep 28.2006 — I get about 100 returned results. Do you suppose using a client side Link'd List would be alright? [/QUOTE]That about one kilobyte of data, not a lot really.

This would be so much easier if I could multi-thread [/QUOTE]I don't know where you are leading with this but Javascript is [URL=http://www.bluishcoder.co.nz/nj/thread1.html]multi threaded[/URL] to some extent.
Copy linkTweet thisAlerts:
@oomagnumooauthorSep 28.2006 — I don't know where you are leading with this but Javascript is multi threaded to some extent.[/QUOTE]

Well, I come form a C++ developement background, so I was thinking, "oohh I can have multiple threads query the database at the same time, so by the time the next letter is pressed I've already started the query."

That's where I was getting at.
Copy linkTweet thisAlerts:
@bokehSep 28.2006 — I think my point number 2 above will gain you the most speed. You only need to do one request to the database not one every keystroke. By the second character you have already narrorowed down your result to less than 0.15 of 1% the total (i.e. 676:1). Even if there were one million entries in the DB 2 characters narrows that down to 1500 or so.
×

Success!

Help @oomagnumoo spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...