JQuery — Таблицы данных — FixedColumns

Я разработал страницу JSP, используя плагины JQuery, Datatables и FixedColumns. Мне нужна таблица данных на моей странице с фиксированными первыми 4 столбцами и всеми остальными подвижными столбцами.

Чтобы загрузить простую страницу jsp из 80 строк * 133 столбца с данными, в IE 8 потребовалось 1 минута и 1 секунда, тогда как в Firefox и Chrome это заняло несколько секунд (хотя у него есть проблемы с выравниванием).

И мой код js выглядит так:

$(document).ready(function() {
          oTable = $('#example').dataTable({
    "sScrollX" :"100%",
    "sScrol

lY" :"500px",
        "sScrollXInner" :"130%",
        "bScrollCollapse" :false,
        "bJQueryUI" :true,
        "bAutoWidth" :false,
        "fnDrawCallback" : function(oSettings) {
        if (oSettings.bSorted || oSettings.bFiltered) {
    for ( var i = 0, iLen = oSettings.aiDisplay.length; i < iLen; i++) {
    $('td:eq(0)',oSettings.aoData[oSettings.aiDisplay[i]].nTr).html(i + 1);
    }
    }
    "sPaginationType" :"full_numbers",
    "bPaginate" :true,"bProcessing" :true,"bServerSide" :true,"aaSorting" : [ [ 1, 'asc' ] ],"sAjaxSource" :"./server_processing.jsp",

"fnServerData" : function(sSource,aoData, fnCallback) {$.ajax( {"dataType" :'json',"type" :"POST","url" :sSource,
"data" :aoData,"success" :fnCallback});});
new FixedColumns(oTable, {"iLeftColumns" :4,"iLeftWidth" :450,"sHeightMatch" :"auto"});});

Только после добавления sScrollX,sScrollY,sScrollXInner страница стала тормозить в IE 8. Также без этого не работает FixedColumns.

Я использовал jquery-1.6.1.js, jquery.datatables 1.8 и jquery Fixedcolumns 2.0. Будем признательны за любую помощь в повышении производительности с помощью jquery + datatables + FixedColumns.

Спасибо


jquery datatables jquery-plugins
person Vidhya Vinodh    schedule 10.06.2011    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Я столкнулся с этим около года назад. Все сводится к тому, как IE отображает innerHTML. DataTables сильно зависит от вызова innerHTML. Я написал об этом в блоге. Медленно Отображение больших таблиц в IE

person Chris Love    schedule 10.06.2011
comment
Очень интересный пост! Знаете ли вы какой-нибудь лучший способ получить HTML в ячейках таблицы? В версии 1.8 есть новые опции для отложенного рендеринга, но я не думаю, что это поможет в случае, описанном Видхья, из-за использования обработки на стороне сервера. - person Allan; 10.06.2011

arrow_upward
0
arrow_downward

Существует несколько способов ускорения работы FixedColumns и DataTables. Первичным с FixedColumns является установка высоты строк в таблице на указанную высоту в CSS и отключение автоматического определения высоты строки в FixedColumns: http://datatables.net/release-datatables/extras/FixedColumns/css_size.html .

Поскольку вы уже используете серверную обработку для DataTable, такие параметры, как отложенный рендеринг, не помогут, но вы можете отключить классы сортировки (bSortClasses) для небольшой дополнительной скорости, хотя с таким небольшим количеством строк я был бы удивлен если это имеет значение.

Учитывая вашу инициализацию, DataTables будет рисовать только 10 строк за раз - 1 минута для рисования, что удивительно медленно. Если дадите ссылку на страницу, будет полезно.

person Allan    schedule 10.06.2011
comment
Я попытался добавить высоту в css и дал sHeightMatch :none, но это заняло еще больше времени для загрузки. Кроме того, я попробовал тот, который дал Деннис по ссылке ниже, но загрузка заняла столько же времени. stackoverflow.com/questions/2406192/ - person Vidhya Vinodh; 14.06.2011