Как повысить скорость фильтрации таблиц JavaScript на смартфонах?

Question

Я хочу отфильтровать таблицу с помощью поля ввода. Это работает, но медленно на смартфонах, которые являются моей целевой платформой - Iphone, Htc Touch HD (800 строк занимает около 4 секунд для фильтрации).

Пожалуйста, дайте мне знать, если вы можете помочь ускорить это.

function time(){
    var now = new Date();
    var time = now.getTime();

    return time
}

function filter (phrase, _id){
    var starttime = time();
    var words = phrase.value.toLowerCase().split(" ");
    var table = document.getElementById(_id);
    var ele = null;
    var rows = new Array();
    for (var r=0 ; r < table.rows.length; r++){
        ele = table.rows[r].innerHTML.replace(/<[^>]+>/g,"");
        var displayStyle = 'none';
        for (var i=0 ; i < words.length; i++) {
            if (ele.toLowerCase().indexOf(words[i])!=-1){
                displayStyle = '';
            }else {
                displayStyle = 'none';
                break;
            }
        }
        rows[r] = displayStyle;
    }
    alert((time() - starttime)/1000 +" Sec");
    for(var k=0; k < rows.length; k++){
        table.rows[k].style.display = rows[k];
    }
}

Answer 1

Похоже, что производительность довольно разумна, учитывая платформу, но вот несколько идей:

1.) Не рассчитывайте длину ваших массивов во время каждой итерации (см. https://developer.mozilla.org/en/A_re-introduction_to_JavaScript#Arrays)

2.) Выполните toLowerCase () для строки поиска один раз в начале, а не в каждой проверенной строке

3.) Самая большая проблема - вероятно ваше использование innerHTML и replace (), но это будет зависеть от реализации браузера, посмотрите, сможете ли вы заменить его более эффективным методом получения текст из ячеек, которые нужно сравнить.

Answer 2

Профилируйте свой JavaScript, используя, например, Firebug profiler . Затем вы можете увидеть, какие операции занимают больше всего времени. Измерение - это знание.