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

Question

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

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

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

Узкое место, по-видимому, состоит в создании таблицы и заполнении списка на стороне клиента, и оно не вызвано извлечением информации из 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-файла в список автозаполнения в указанном выше параметре URL-адреса заполнителя AJAX.В своем PHP-коде измените генерацию списка так, чтобы он возвращал массив значений JSON, например:

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

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

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

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

Answer 2

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

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

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