Как повысить производительность при рендеринге <table> в IE 8?

Question

Как повысить производительность при рендеринге <table> в IE 8?

0

У меня есть функция jquery, которая добавляет тег в первую строку таблицы. Я попытался использовать append, но его не работает, поэтому я получил решение, которое очень медленно, и оно каким-то образом дает ошибку. "Скрипт на этой странице приводит к медленному запуску Internet Explorer..."

Функция - это

 jQuery.fn.fixGridView = function () {
        "use strict";
       // var start = +new Date();  // log start timestamp 
        if (jQuery(this).is('table') && this.find('thead').length === 0) {

            var theadv = "<thead><tr>" + this.find('tbody tr:first').html(); +"</tr></thead>";

            this.find('tbody tr:first').remove();
            var htmlv = this.html();
            this.html(theadv + htmlv);
        }
        //var end = +new Date();  // log end timestamp
       // var diff = end - start;
       // alert(diff);
        return this;
    };

Может ли кто-нибудь помочь мне сделать этот код быстрее?

EDIT: Я должен использовать IE... это требование (ie8). Edit2: Я создал js скрипку: http://jsfiddle.net/4xLzL/

user1181942 02 май 2014, в 07:10

Источник

0

Шаг 1: не используйте IE.
Fizzix 02 май 2014, в 05:03
1

Я должен использовать IE .. Это требование клиента
user1181942 02 май 2014, в 05:05
0

Вы можете сделать скрипку, пожалуйста?
A.T. 02 май 2014, в 05:09
0

Это лучше подходит для codereview.stackexchange
Praveen 02 май 2014, в 05:19
0

@Aron: я создал jsfiddle: проверьте мои правки
user1181942 02 май 2014, в 05:28
0

Это медленно, потому что вы имеете дело с созданием и добавлением элементов DOM. Вы также не « .find() » вещи, для которых вы .find() так что вы делаете более 1 поиска.
Henrik Andersson 02 май 2014, в 05:36

Показать ещё 4 комментария

Теги:

javascript

jquery

dom

internet-explorer-8

2 ответа

Ещё вопросы

Я должен использовать IE .. Это требование клиента
Вы можете сделать скрипку, пожалуйста?
Это лучше подходит для codereview.stackexchange
@Aron: я создал jsfiddle: проверьте мои правки
Это медленно, потому что вы имеете дело с созданием и добавлением элементов DOM. Вы также не « .find() » вещи, для которых вы .find() так что вы делаете более 1 поиска.

sweetamylase · Answer 1 · 2014-05-02T04-29-00.000Z

Чтобы повысить производительность рендеринга, вы должны понимать, что манипуляции с DOM (включая перепланировки и перерисовки) являются дорогостоящими операциями. Ваш код в настоящее время повторно создает всю таблицу с добавлением <thead> большая часть содержимого <tbody> остается неизменной. Этот массивный "перерисовка" таблицы очень неэффективен. Особенно, когда в IE 8, где таблицы рендеринга являются слишком медленными, вам необходимо как можно меньше изменить DOM.

Я реорганизовал вашу логику, чтобы свести к минимуму количество выполняемых запросов, чтобы найти элементы, сохранив их в переменной, которую нужно повторно использовать. Также удалил вызов .html('...') который повторно отображает таблицу, но вместо этого использовал .prepend() чтобы добавить <thead> в <table> в качестве первого дочернего .prepend().

jQuery.fn.fixGridView = function () {
    "use strict";
    var start = +new Date(); // log start timestamp 
    if (this.is('table') && this.children('thead').length === 0) {

        var firstRow = this.children('tbody').children('tr:first');
        var thead = "<thead><tr>" + firstRow.html() + "</tr></thead>";
        firstRow.remove();
        this.prepend(thead);
    }
    var end = +new Date(); // log end timestamp
    var diff = end - start;
    alert(diff);
    return this;
};

$(document).ready(function () {
    $('table[id*="gvCategories"]').fixGridView();
});

Идите и протестируйте его в IE8: http://jsfiddle.net/amyamy86/4xLzL/7/

Kent Anderson · Answer 2 · 2014-05-02T04-48-00.000Z

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

$('table [id*="gvCategories"]').fixGridView();

Я также обновил скрипку.

Спасибо @Kent: это работает в скрипке, однако мой код все еще медленный ..