How to make a fast ajax live search - php

Question

Hi, im trying to do a ajax live search. It work`s, but i want it to be fast. Currently i`m processing the html by php, but even if i change the processing to js and only get the data from php it only improves my search from 2.1 to 1.8 seconds (this is the request time, but it takes 4/5 seconds for the data to appear)
Heres my code:
$("#searchfield").change(function() {
term = $(this).val();
if (searchReq != false) {
searchReq.abort();
}
searchReq = $.get("/searchModal.php", {
term : term
}).done(function(data) {
$("#liveSearch").html(data);
});
});
EDIT:
php code:
search.php:
$files = filecontroller::search($term);
file controller:
public static function search($term, $by = false, $order = false) {
connection::connect();
$files = ($by && $order && validation::filesOrder($by, $order)) ? file::Search($term, $by, $order) : file::Search($term);
return $files;
}
File model:
public static function Search($term, $by = 'date', $order = 'DESC') {
$session_id = $_SESSION["user_id"];
$term = mysql_real_escape_string($term);
$query = mysql_query("SELECT * FROM files WHERE idUser = '$session_id' AND (name LIKE '%$term%' OR description LIKE '%$term%') ORDER BY $by $order");
$files = self::CreateFromDb($query);
return $files;
}
private static function CreateFromDb($query) {
GLOBAL $imgDir; // just get the img dir from a config file
GLOBAL $userDir; // same
$files = array();
while ($row = mysql_fetch_assoc($query)) {
$file = new File();
$file -> type = $row['type'];
$file -> idFile = $row['idFile'];
$file -> user = $row['idUser'];
$file -> gallery = $row['idGallery'];
$file -> name = htmlspecialchars($row['name']);
$file -> description = htmlspecialchars($row['description']);
$file -> date = $file -> timecheck($row['date']);
$file -> size['kb'] = $row['size'];
$file -> galleryName = Gallery::getName($file -> gallery);
$files[] = $file;
}
return $files;
}
Is there anyway to improve it? Im testing in local.

Answer 1

There are some issues with your code, but nothing obvious.
Some starting points:
The best way to find what's slow is probably to check profiling in PHP.
Another thing is that you're using LIKE "%x%" which will be slow if your user has lots of files (seems unlikely, but who knows). Check the MySQL slow query log.
You're also doing some disk access, but it shouldn't be this slow either - unless something strange is going on inside Gallery::getName or timecheck.
Note that the mysql extension has been deprecated. This has nothing to do with speed though, it's just outdated.

Answer 2

ANSWER
.change has a delay, for real time results its better to use .keyup. I cme up using a timeout to make the request only when user stop typing:
var searchTimeout;
var searchReq;
$("#searchfield").on('keyup', function() {
term = $(this).val();
if (searchTimeout) {
clearTimeout(searchTimeout);
}
if (searchReq) {
searchReq.abort();
}
searchTimeout = setTimeout(function(){
if (term.length > 2) {
searchController(term).then(function(data) {
$("#liveSearch").html(data);
});
}
else {
$("#liveSearch").html("");
}
},500);
});
function searchController(term) {
searchReq = $.ajax({
type : "GET",
url : "/searchModal.php",
data : {
term : term
},
async : true,
context : this,
beforeSend : function() {
},
complete : function() {
}
});
return searchReq;
}
Its still slow compared to facebook, and other big sites. I guess the only way to acess it fast would be with a great server or cached results (i tried to just echo an string without bd requests and its slow too).