Просматривая написанный код всегда можно найти место, где можно его оптимизировать. Нашел у себя код на js, который выполнял поиск по базе.
Код был примерно таким.
<input onkeyup="search()" id="search">
Как видно функция срабатывает при отпускании клавиши. Что не совсем правильно, т.к. например если ввели 5 символов в поле, то в базу пойдет 5 запросов, а достаточен всего лишь 1, который выполнится с задержкой после ввода. Это можно устроить, путем введения таймера.
В ява скрипт есть функции для работы с ними.
var timeout_id = window.setTimeout(func|code, delay); — создает единичный таймер, при срабатывании которого происходит вызов определенной функции после указанной задержки (в миллисекундах).
var interval_id = window.setInterval(func|code, delay); — похож на предыдущий setTimeout, но вызывает функцию постоянно (каждый раз с заданной задержкой), пока не будет отменен.
clearInterval(timeout_id);, clearTimeout(interval_id); — принимают в качестве параметр ID таймера.
Будем использовать setInterval().
Код функции search() перенесем в новую функцию searchGo(), а в search() напишем следующий код, используя setInterval с помощью которого будем оптимизировать:
function search(){ var k = -1; setInterval( function(){ if(k >= 0) k++; if(k >= 5) { k = -1; searchGo(); } } , 100 ); $('#search').keyup(function(){ k = 0; }); }
Далее из input уберем событие inkeyup, а вызов функции search() вставим в body onload.
Скрипт работает так:
1)при отпускании клавиши (событие keyup()) обнуляется счетчик k, и в таймере каждые 100сек k увеличивается на 1.
2)если счетчик стал равен 5, т.е. прошло 0.5 секунды, то счетчик отключается и вызывается функция поиска.
Как видно, при каждом отпускании клавиши счетчик обнуляется. И вместо кучи запросов на каждое отпускание клавиши, срабатывает только один, который вызывается, если в поле ничего не вводили больше 0.5 сек.
Если у вас есть более удачный пример оптимизации похожего кода, пишите.