FixedColumns performance problem

FixedColumns performance problem

paepae Posts: 2Questions: 0Answers: 0
edited September 2011 in Plug-ins
Hi everyone,

I'm using fixedColumns plugin to keep fixed the first left column of several table on a page with many tables. This works perfectly except it takes like 2 seconds per table to do the job, so the browser hangs and asks to terminate the script. I tried to add "sHeightMatch": "semiauto" as suggested in another thread, but it is still really slow.

The tables all have only 12 rows but they may have 40+ columns. If I comment out the FixedColumns part, everything is fine.

I'm currently using dataTables 1.8.0 and FixedColumns 2.0.1 and I'm calling dataTable like this :

[code]
jQuery('.yearTable').dataTable({
"bPaginate" : false,
"aaSorting" : [],
"sScrollX" : "100%",
"sScrollInner" : "150%",
"bFilter" : false,
"bAutoWidth": false,
"bSortClasses": false,
"bInfo": false,
"fnInitComplete" : function() {
new FixedColumns( this, {
"sHeightMatch": "semiauto"
} );
}
});

[/code]

I suppose I'm doing something wrong, this plugin is for use with a lot of columns isn't it ? Or should I use FixedHeader ?

Thanks

Replies

  • allanallan Posts: 63,494Questions: 1Answers: 10,470 Site admin
    That's depressingly slow for only 12 rows :-(. Any chance you can give us a link? Are your rows all of equal height? If so, then you can use CSS to do the height matching which is MUCH faster: http://datatables.net/release-datatables/extras/FixedColumns/css_size.html

    Allan
  • paepae Posts: 2Questions: 0Answers: 0
    Thanks for yout quick answer. I can't give you a direct link so I made a sample html : http://pastebin.com/WmnXusqT
    where go.js is
    [code]
    jQuery(document)
    .ready(function() {
    var time= new Date();
    jQuery('.yearTable').dataTable({
    "bPaginate" : false,
    "aaSorting" : [],
    "sScrollX" : "100%",
    "sScrollInner" : "150%",
    "bFilter" : false,
    "bAutoWidth": false,
    "bSortClasses": false,
    "bInfo": false,
    "fnInitComplete" : function() {
    new FixedColumns( this, {
    "sHeightMatch": "none"
    } );
    jQuery('body').append('
    Time taken : '+(new Date()-time));
    }
    });
    });
    [/code]

    All rows might have the same height (I think it depends on the table) but I didn't notice any improvement with "sHeightMatch": "none".
This discussion has been closed.