Почему используется gridview:true и что это значит?

Я работаю над JqGrid.

Я хочу знать, что это значит, если мы укажем gridview:true,

И в каких случаях мы должны предоставить?

Я недавно работал над одним таким jqGrid и мой afterInsertRow не вызывали, как только я gridview:true Теперь звонок сделан.

Это один случай, который я сам испытал, мне было интересно, есть ли другие случаи, которые мы должны знать, если gridview:true используется.

Пожалуйста, объясните мне это.

Источник

2 ответа

Решение

Я согласна с тем что gridview: true Опция не очень хорошо объясняется в документации. В некоторых случаях (например, в случае TreeGrid) опция будет установлена ​​автоматически. Поэтому я пытаюсь объяснить, что это значит и почему я рекомендую всегда использовать gridview: true вариант и никогда не использовать afterInsertRow,

Многие люди начинают с некоторых других компьютерных языков как JavaScript и пишут свою первую программу, которая запускается в веб-браузере после того, как у них есть какой-то стиль написания программ. У меня была такая же проблема 3 года назад. Важно понимать, что должен делать веб-браузер после внесения некоторых изменений на HTML-странице. В использовании jQuery это то, что вы постоянно делаете.

Если вы измените какой-либо элемент DOM на странице, позиция всех других элементов DOM, существующих на странице, может быть изменена. Если вы думаете о плавающей модели (как с float: left) или многие другие настройки CSS, вы поймете, что веб-браузер не может просто переместить растровое представление существующей страницы и вставить новый вставленный элемент. Таким образом, веб-браузер должен пересчитать положение всех элементов, существующих на странице, и переместить некоторые из элементов в другое место. Даже если вы измените стиль CSS элемента, произойдет так называемое перекомпонование. Я бы порекомендовал вам прочитать статью и посмотреть видео на эту тему.

Основной идеей повышения производительности веб-браузера в описанном выше случае будет уменьшение количества изменений на странице. Поэтому, если вам нужно изменить 5 стилей одного элемента DOM, вы должны сделать это за одну операцию. Ты можешь использовать jQuery.css({...}) со всеми измененными стилями вместо 5 отдельных вызовов. Еще лучше было бы определить один класс CSS и использовать jQuery.addClass метод.

В случае jqGrid необходимо заполнить <tbody> со всеми строками и ячейками сетки. Если вы используете gridview: true Затем опция jqGrid собирает содержимое всех строк в виде строк с фрагментами HTML. Позже вызов jqGrid jQuery.append в линии, которая установлена ​​внутри innerHTML свойство, чтобы установить весь HTML-фрагмент на странице.

По той же причине, вы должны использовать cellattr, rowattr или пользовательские средства форматирования, которые работают с фрагментами HTML, представляющими ячейки или строки в виде строк. В конце строки будут добавлены к другим строкам и будут использованы в jQuery.append операция, как я описал выше.

Использование afterInsertRow функция обратного вызова требует, чтобы каждая строка сетки была размещена на странице перед вызовом afterInsertRow Перезвоните. Так что это делает невозможным использование gridview: true вариант и сделать работу страницы медленно.

Чтобы быть точным, я должен отметить, что снижение производительности, которое я описал ранее, может быть видно только в случае большой сетки и будет в основном ясно видно в случае медленного веб-браузера (например, Internet Explorer, особенно старых версий IE).

Источник

Согласно документации jqGrid для gridview:

В предыдущих версиях jqGrid, включая 3.4.X, чтение относительно большого набора данных (количество строк>= 100) вызывало проблемы со скоростью. Причина этого состояла в том, что, поскольку каждая ячейка была вставлена ​​в сетку, мы применили к ней от 5 до 6 вызовов jQuery. Теперь эта проблема решена; Теперь мы вставляем строку ввода сразу с добавлением jQuery. Результат впечатляющий - примерно в 3-5 раз быстрее. Каков будет результат, если мы вставим все данные одновременно? Да, это можно сделать с помощью параметра gridview (установите его в true). В результате получается сетка, которая в 5-10 раз быстрее. Конечно, когда эта опция установлена ​​в true, у нас есть некоторые ограничения. Если установлено значение true, мы не можем использовать treeGrid, subGrid или событие afterInsertRow. Если вы не используете эти три параметра в сетке, вы можете установить для этого параметра значение true и наслаждаться скоростью.

Таким образом, используя эту опцию, вы можете получить хорошее улучшение скорости, учитывая, что он не совместим с treeGrid, subGrid или afterInsertRow, Я считаю, что это степень ограничений. Если вы найдете больше, дайте нам знать, чтобы документация могла быть обновлена.

Для чего это стоит, вы можете увидеть конкретные случаи в grid.base.js методы addXmlData а также addJSONData где afterInsertRow пропускается:

if(ts.p.gridview === false ) {
    $("tbody:first",t).append(rowData.join(''));
    $(ts).triggerHandler("jqGridAfterInsertRow", [rid, rd, xmlr]);
    if(afterInsRow) {ts.p.afterInsertRow.call(ts,rid,rd,xmlr);}
    rowData=[];
}

Ограничения treeGrid и subGrid более тонкие и явно не вызываются в коде.

Источник
Другие вопросы по тегам