Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: Общие вопросы > При обработке большого массива браузер виснет

Автор: Elliner 4.4.2013, 15:41

(сразу скажу, что я сисадмин, а не программист, но написать кусок кода необходимо).

Скрипт с интервалом запрашивает данные с сервера, получая ответ в формате json.
Далее с помощью цикла each обрабатывается каждый элемент и пихается в функцию, которая уже расфасовывает данные в определенную ячейку таблицы на сайте.

Код


function update_data(){
   
    setTimeout(function(){
        getIPList();
        update_data();
    },
    5000);
}

function getIPList(){
    $.getJSON('all_entries.php', function(json){
        if (json.iplist.length > 0){
               $.each(json.iplist, function(){
                  insert_row(this);
            });
        }
    });
}

function insert_row(ira){
   $('#'+ira['ip_dex'] +' .ip').text(ira['ip']);
   $('#'+ira['ip_dex'] +' .dns').text(ira['dns']);
 $('#'+ira['ip_dex'] +' .mac').text(ira['mac']);

Код


<table>
<tr id="333333333">
<td class="ip"><td>
<td class="dns"></td>
<td class="mac"></td>
</tr>
</table>

Все работает, но каждый раз при занесении данных (перерисовке таблицы) браузер "подвисает". Я так понял, подвисает он до тех пор пора не занесет ВСЕ данные на страницу...
Хочу узнать, существует ли решение, которое позволит "растормозить" браузер, например возвращать управление браузеру в промежутках между обработкой каждого элемента массива с json-данными?

Надеюсь относительно понятно сформулировал вопрос. Спасибо!

Автор: KuZyagroup 4.4.2013, 15:54

Elliner,
В вашем случае есть смысл склеить весь вывод одну строку и потом удалить старую таблицу и вставить новую, если браузер подвисает, и нету сложностей с тем что на таблицу навешены какие то события которые геморойно перезапускать(думаю что нету)

Автор: Aliance 4.4.2013, 15:55

M
Aliance

Все же лучше следовать правилу: 1 тема - 1 вопрос

А зачем на 13 строчке возврат данных? При таком подходе $.each(json.iplist не выполнится никогда. А что делает функция update_data? Или она не важна в контексте вопроса?

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

Автор: Elliner 4.4.2013, 16:13

KuZyagroup,
Сразу вопрос, таблица не маленькая, в реальных условиях минимум 200 строк и 15 колонок. Будет ли такая перерисовка незаметна для пользователя?
Плюс в таблице должны быть столбцы с input полями (на них по классу навешано событие onchange + с отправкой данных). Планировалось, что при редактировании данных в определенной строке, эта строка обновляться не будет (путем навешивания какого-нибудь аттрибута).

Aliance, Исправил (ошибка вкралась... smile

)
Сам склонялся к подобному решению, но нехватает знаний по реализации...
Родной функции array_chunk насколько я понимаю в JS нет?

update_data,... используется для многократного повторения функции getIPList c задержкой.

Автор: KuZyagroup 5.4.2013, 11:48

Elliner,
Будет ли такая перерисовка незаметна для пользователя? -> Думаю будет не заметной
на них по классу навешано событие onchange + с отправкой данных --> надо будет повесить еще раз