Optimize responsive recalc on page with a lot of rows

itajackass

I have a global script that runs on every pages of my web app:

$(document).on('shown.bs.tab', 'a[data-toggle="tab"]', function (e) {
  $.fn.dataTable.tables( {visible: true, api: true} ).columns.adjust().responsive.recalc().draw();
});

I use this to redraw all tables inside my page when they are on some bootstrap hidden tabs.

It works great for few rows.... but when i have a lot of rows, the switch from one tab to another tab, my page freeze for some seconds until redraw is complete.

Is there a better way to fix this "freeze"? maybe an "async" method to recalc all tables to prevent script to wait?

colin

Hi @itajackass ,

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

itajackass

hi @colin, unluckely, i tried to replicate the problem with a jsfiddle demo but the problem doesn't appear. probably my web app has a lot of js that slow all the rendering...