Медленный рендер Ajax-ответа

264
15 февраля 2018, 13:57

Есть сформированный Ajax-запрос вида:

        $.ajax({
            type: 'POST',
            url: '../funcs/outgo.php',
            data: {
                qtype: 'report',
                period: JSON.stringify(period),
                access: 1
            },
            beforeSend: function(){},
            success: function(data){
                $('.loading_list').remove();
                data = $.parseJSON(data);
                console.log(data['response']);
                if($('.choose_date div.checked').attr('data-period') == 'period') {
                    var checkedlabbel = $('.choose_date div.checked input[name=period_from]').val() + ' / ' + $('.choose_date div.checked input[name=period_to]').val();
                }
                else {
                    var checkedlabbel = $('.choose_date div.checked .label').text();
                }
                $('.outgo.label').append('<span class="checkday">' + checkedlabbel + '</span>');
                if (data['exist'] == true) {
                    $('.summ_block').show();
                    $('.outgotable tbody').append(data['response']);
                    $('.outgotable tr.products').each(function(key){
                        var order = $(this).attr('data-products-of-order');
                        var order_summ = 0;
                        $('.product',this).each(function(index,value){
                            var product_summ = $('div:nth-child(6)',value).text();
                            product_summ = product_summ.replace(/\D/g, '');
                            product_summ = parseInt(product_summ);
                            order_summ = order_summ + product_summ;
                        });
                        $('.outgotable .orderrow[data-order-id='+order+'] td:nth-of-type(4) .order_summ').number(order_summ,0,'',' ').append(' тенге');
                    });
                    $('.summ_block .orders_summ_1 .value').text(data['soldOrders']);
                    $('.summ_block .orders_summ_2 .value').text(data['soldOrdersSumm']);
                    $('.summ_block .orders_summ_3_1 .value').text(data['soldClearSumm']);
                    $('.summ_block .orders_summ_3_2 .value').text(data['soldClearNoDebtSumm']);
                    $('.summ_block .orders_summ_4 .value').text(data['soldDebts']);
                    $('.summ_block .orders_summ_5 .value').text(data['soldDebtsSumm']);
                } else if (data['exist'] == false) {
                    $('.outgotable').hide();
                    $('.summ_block').hide();
                    $('<div class="no_exist">Нет продаж</div>').insertAfter('.outgotable');
                }
            },
            complete: function(){
                menuHeight();
            }
        });

От сервера довольно быстро приходят данные, записываются в элемент массива data['response'].

На строке

$('.outgotable tbody').append(data['response']);

скрипт сильно зависает. При большой длине строки data['response'] страница зависает насмерть. Есть ли способы оптимизации данных при добавление данных на страницу.

Answer 1

Извиняюсь, проблема была не в append функции, а в большом количестве each циклов, обрабатывающих ответ.

READ ALSO
Вытащить текст из html в php

Вытащить текст из html в php

Доброго времени сутокСтоит такая задача: вытащить текст из html в php

229
Правильное позиционирование svg polygon?

Правильное позиционирование svg polygon?

Создал svg polygon треугольник, теперь встал вопрос, как правильно его выровнять по центру изображения?

235
html;css margin:0 auto; выравнивание по центру

html;css margin:0 auto; выравнивание по центру

Локально подключен bootstrap,возможно запутался в наследовании

218