Slow AJAX
Moderator: General Moderators
Slow AJAX
I've made an AJAX application that searches whilst the user types. It's in pre-pre-pre-pre alpha stage so excuse the design and formatting.
The problem is that the text box that the user types the search query into acts really slowly when they type (there is a delay). Test it out at:
http://www.marcusl.com/testing/search.php
If anyone knows why could they please look at the code and tell me what I need to do to make it faster. I'm new to AJAX, but I want to utilise its full potential.
Thanks
The problem is that the text box that the user types the search query into acts really slowly when they type (there is a delay). Test it out at:
http://www.marcusl.com/testing/search.php
If anyone knows why could they please look at the code and tell me what I need to do to make it faster. I'm new to AJAX, but I want to utilise its full potential.
Thanks
- Christopher
- Site Administrator
- Posts: 13596
- Joined: Wed Aug 25, 2004 7:54 pm
- Location: New York, NY, US
Re: Slow AJAX
Probably asynchronous calls would help. You also don't need to search until there is a pause in the typing, so you can check the typing interval and not do a request if another keypress comes within that interval.
(#10850)
Re: Slow AJAX
Asynchronous calls? I understand the idea of AJAX but the functions and stuff evade me. I just copied this from a tutorial and it worked
. I see what you mean about the typing interval, but how can you tell what is a pause in typing between slow typing or thinking time? It's a shame not everyone can touch-type 
Why is there a delay on the text box though? It happens when the search results are being requested, but there is no sudden influx in processor or memory usage on the client side so why should the browser act slowly? This has happened on two different computers and different browsers I use so I know it's not just my computer.
As always, all help is appreciated
Why is there a delay on the text box though? It happens when the search results are being requested, but there is no sudden influx in processor or memory usage on the client side so why should the browser act slowly? This has happened on two different computers and different browsers I use so I know it's not just my computer.
As always, all help is appreciated
- Christopher
- Site Administrator
- Posts: 13596
- Joined: Wed Aug 25, 2004 7:54 pm
- Location: New York, NY, US
Re: Slow AJAX
I would recommend using Prototype, jQuery, mootools, etc. They will have lots of Ajax examples -- probably even one like this that uses async calls, etc.
(#10850)
Re: Slow AJAX
jQuery is amazing! Thanks arborint! Although there is one slight problem, I realise the difference that asynchronous calls make now, but I need to make it faster still. I know this might be getting annoying now, but could you please point me in the right direction to solve this problem:
Currently
User types letter,
Request for page,
Wait for page (user still typing),
Page recieved (user finished typing, pages trying to catch up)
What I would like
User types letter,
Request for page,
Previous page requests cancelled upon new page request,
Outcome: The results would only be shown when the search result's query is the same as that of the text box (no pile-up of pages)
I'm using this:
http://docs.jquery.com/Ajax/jQuery.ajax#options
But there is no abort or cancel option for previous calls
As of the time of this post my script is:
The abort() doesn't seem to work though.
This would solve the problem once and for all if I could cancel the unwanted calls and so increase the speed!
Currently
User types letter,
Request for page,
Wait for page (user still typing),
Page recieved (user finished typing, pages trying to catch up)
What I would like
User types letter,
Request for page,
Previous page requests cancelled upon new page request,
Outcome: The results would only be shown when the search result's query is the same as that of the text box (no pile-up of pages)
I'm using this:
http://docs.jquery.com/Ajax/jQuery.ajax#options
But there is no abort or cancel option for previous calls
As of the time of this post my script is:
Code: Select all
function ajaxFunction(str){
var prefix = "q=";
if ( req ) req.abort();
var datasend = prefix + str
var req = $.ajax({
type: "GET",
url: "search-msn.php",
data: datasend,
async: "true",
success: function(msg){
document.getElementById("searchpane").innerHTML = msg;
}
});
}This would solve the problem once and for all if I could cancel the unwanted calls and so increase the speed!
- Christopher
- Site Administrator
- Posts: 13596
- Joined: Wed Aug 25, 2004 7:54 pm
- Location: New York, NY, US
Re: Slow AJAX
Instead of making the Ajax call directly, for each keypress start a timer that will call the Ajax function. For each new keypress, cancel the pending call and start a new timer. That way the Ajax calls happen only after they pause typing.
(#10850)
Re: Slow AJAX
I'm not trying to be awkward, but I really would like to know how to cancel AJAX calls, not just for this. I understand what you mean about the delaying of the call and how that will increase its efficiency, but if there is only one ajax call out at a time then the server load would be constant, yet no overloaded and the user would have an instant result.
If there is absolutely no way to abort the call then could you please explain how to do a countdown in milliseconds.
I tried:
which just delays each call and doesn't restart each time a key is pressed. I searched for javascript countdown, but all I got was date countdowns.
I really appreciate all the help you've given me arborint
If there is absolutely no way to abort the call then could you please explain how to do a countdown in milliseconds.
I tried:
Code: Select all
function delaysearch(str)
{
var delay = setTimeout(ajaxFunction(str),1000);
}I really appreciate all the help you've given me arborint
- Christopher
- Site Administrator
- Posts: 13596
- Joined: Wed Aug 25, 2004 7:54 pm
- Location: New York, NY, US
Re: Slow AJAX
It works!!!
Thanks arborint!
I promise this is the last problem. The line which causes the delay on searching is an 'invalid argument'. This the surrounding code:
and it's this line:
Even without previously defining delay the error occurs.
Help me out one last time arborint
Thanks arborint!
I promise this is the last problem. The line which causes the delay on searching is an 'invalid argument'. This the surrounding code:
Code: Select all
var delay = "";
function delaysearch(str)
{
delay = setTimeout(ajaxFunction(str),500);
}Code: Select all
delay = setTimeout(ajaxFunction(str),500); Help me out one last time arborint
- Christopher
- Site Administrator
- Posts: 13596
- Joined: Wed Aug 25, 2004 7:54 pm
- Location: New York, NY, US
Re: Slow AJAX
I think you have not read the manual for setTimeout() carefully.
It takes an expression, not the return value of that function. So:
Code: Select all
delay = setTimeout("ajaxFunction(\""+str+"\")",500);(#10850)