tableSorter slow loading

I am using a tablesorter plugin with filter, paging and sorting on a big table. The style is applying very slow on page load (user sees an unformatted table). I was thinking to simply hide the table until it is completely loaded.

How can I achieve this?

Here is my tableSorter initialization code:

<!-- language: lang-js -->

$("#report").tablesorter({
  theme: 'blue',
  widthFixed: true,
  widgets: ["zebra", "filter", "savePagerSize"],
  widgetOptions: {
    filter_childRows: false,
    filter_columnFilters: true,
    filter_cssFilter: 'tablesorter-filter',
    filter_filteredRow: 'filtered',
    filter_formatter: null,
    filter_functions: null,
    filter_hideFilters: false,
    filter_ignoreCase: true,
    filter_liveSearch: true,
    filter_searchDelay: 300,
    filter_serversideFiltering: false,
    filter_startsWith: false,
    filter_useParsedData: false
  }

}).tablesorterPager({
  container: $("#pager")
});

In some cases, it's helpful to display some of the rows for positioning purposes. In that case, you start by hiding some of the rows while the page loads so it doesn't have as much rendering work to do, and then once the table's been initialized, make sure they're all visible.

<!-- language: lang-css -->

/* hide bulk of table until it's been initialized'*/
.tablesorter tbody tr:nth-child(n+10),
.tablesorter tfoot tr {
    display: none;
}
/* if we've been decorated, we've been initialized */
.tablesorter.tablesorter-bootstrap tbody tr,
.tablesorter.tablesorter-bootstrap tfoot tr {
    display: table-row
}

Tablesorter will automatically decorate the table with any widget classes once it's been initialized. If you don't have any widgets, you can add your own class to the table by tapping into the tablesorter-initialized event

<!-- language: lang-js -->

$("table").tablesorter({
  // this is equivalent to the above bind method
  initialized : function(table){
    $(table).addClass('tableInit');
  }
});

Demo in Plunker