Ускорение автозаполнения jQuery (неизбежно длинные списки)

Question

Я начал свое путешествие, чтобы ускорить автозаполнение jQuery ранее сегодня днем, и решил, что, вероятно, неплохо начать memcaching все. Как предложено в этой статье: Speeding up autocomplete.

Однако, я все еще имею дело с медленным временем отклика даже после установки и использования Memcached.

Проблема в моем случае заключается в том, что я имею дело с необычайно длинными списками, в моем случае, над отдельных членов. (Все роды или родов всех растений)

Узкие, кажется, построение таблицы и заполнение списка на сторону клиента, и он не вызывается путем извлечения информации из Memcached.

Если кто-то другой столкнулся с этой конкретной проблемой, мне бы очень хотелось услышать о умном способе ее решения. Я отправлю свой код ниже.

Примечание: Эта страница недоступна для широкой публики, и я знаю, что есть несколько зияющих отверстий для безопасности.

---

require_once 'oo/Database.php'; 

$mysqldb = new Database; 

$memcache = new Memcache; 
$memcache->connect('localhost', 11211) or die ("Could not connect to memcache"); 

$sql = "SELECT DISTINCT `Genus` FROM importlist.plants"; 

$key = md5('query'.$sql); 

$result = $memcache->get($key); 


//check if we got something back 
if($result == null) { 

    //fetch from database 
    $result = $mysqldb->rawSelect($sql)->getResult(); 

    //set to memcache, expires after 1 hour 
    $memcache->set($key,$result,0,3600); 
} 

//Result array 
$Genera = ($memcache->get($key)); 

//Add required "quotation marks" for autocomplete 
foreach ($Genera as &$Genus){ 
    $Genus = '"'.$Genus[Genus].'"'; 
} 
$Genera = implode($Genera,','); 

//PHP to generate jQuery  
echo <<< EOT 

    <script> 
    $(function() { 
     var availableTags = [$Genera]; 
     $("#tags").autocomplete({ 
      source: availableTags 
     }); 
    }); 
    </script> 
EOT; 

?> 

<input id="tags" /> 

Answer 1

$(document).ready(function() { 

    // once page loads, make AJAX request to get your autocomplete list and apply to HTML 
    $.ajax({ url: '/path-to-get-tags-as-json.php', 
     type: "GET", 
     contentType: "application/json", 
     success: function(tags) { 
      $("#tags").autocomplete({ 
       source: tags 
      }); 
     } 
    }); 
}); 

Поместите URL в файл PHP в генерирует список автозаполнения в приведенном выше AJAX заполнителем URL параметра. В вашем PHP коде, изменить генерацию списка, так что она возвращает JSON массив значений типа так:

[ "first" , "second" , "anotherEntry" , "in" , "the" , "array" ]  

Это определенно не ускорить серверный процесс, но будет защитить ваш пользователи из некоторых задержек при применении списка автозаполнения. Это в значительной степени предполагает, что пользователь не сразу выполняет выполнение действия, которое требует автозаполнения, вы все равно можете загрузить страницу и позволить пользователю выполнять другие действия. Загрузка списка автозаполнения должна по большей части казаться бесшумной и бесшовной.

Это замечательно для времени загрузки, которое составляет от нескольких до нескольких секунд, но если это займет у вас больше времени, ваши пользователи все равно могут столкнуться с проблемой удобства использования.

Если есть еще задержки на стороне сервера, подумайте об использовании некоторых операторов синхронизации, чтобы попытаться определить, где находится узкое место.

Answer 2

Поскольку вы не можете найти что-либо, пока пользователь не наберет не менее 1 символа, вы можете создать 26 разных списков. Каждый список автозаполнения содержит только элементы, начинающиеся с этой буквы. Ваши списки будут значительно меньше и быстрее загружаться.

Чтобы сделать это еще быстрее, создайте больше списков. Вам, вероятно, нужны только первые 30-40 элементов для отображения. Если элемент не находится в сокращенном списке, пользователь, скорее всего, напечатает другую букву. Затем вы можете разделить свои списки на 26 * 26 уникальных списков. Каждый список содержит только элементы, которые начинаются с первых двух букв.

Вы можете разделить свои предметы на столько списков, сколько необходимо. Мы делаем это на сайте, которым я управляю, где у нас есть более 500 тысяч предметов, доступных в нашем стиле.