md-table-pagination Page selector with 'big data'

[VeryStrongFingers]

I've been playing around with this module and server side pagination of 'big data' (big data = ~70,000 records - Not that big), and have noticed that within the module 'md-table-pagination.html' where the for each page number is being generated is causing CPU bottleneck.

https://github.com/daniel-nagy/md-data-table/blob/1cef4dbacd977110ed70ccd74609f8228772b64a/dist/md-data-table.js#L1292

angular.module('md-table-pagination.html', []).run(['$templateCache', function($templateCache) {
  $templateCache.put('md-table-pagination.html',
     //Excerpt
    '<md-select class="md-table-select" ng-show="showPageSelect()" ng-model="page" md-container-class="md-pagination-select" ng-change="onPageChange()" aria-label="Page">\n' +
    '  <md-option ng-repeat="num in range(pages()) track by $index" ng-value="$index + 1">{{$index + 1}}</md-option>\n' +
    '</md-select>\n' +

Namely: ng-repeat="num in range(pages()) track by $index" 

So the higher the pages() return value, the more md-option elements obviously, and it just becomes really sluggish. Technically not a fault of md-data-table, more-so angular material however it does seem logical to have some sort of page range algorithm or some logical UX to handle this part logically when there's an excessive amount of pages.

tl;dr: Page selector in causes bottleneck when there's lots of pages.

[daniel-nagy]

hmm...

If you have 70,000+ records and you display 10 items per page then thats 7,000+ pages. At that point I think it would be best to introduce a step to the page selector. Every 5 pages or every 10 pages from the current page. This could greatly reduce the bottle neck and I don't think the user will feel deprived in anyway.

The other option would be to lazy load every 100 pages or so. So allocate 100 pages and if the user scrolls close to the bottom allocate another 100 pages until we reach the maximum page.

I should probably do the second option but also provide a way to do the first option.

[VeryStrongFingers]

There's also the option of using Angular's 'virtual repeat' - https://material.angularjs.org/latest/demo/virtualRepeat I have not personally used it myself, so I'm not sure how practical it would be for this though.

[daniel-nagy]

I tried using it with the mdSelect decretive in one of their examples but it didn't seem to work.

[nevernet]

I got same issue, there is over than 2,500,000 records, when the md-table-pagination to render "Page", the whole page was crashed.

[daniel-nagy]

#250

[nevernet]

so, the issue has been closed, but what's solution?

thank you

[VeryStrongFingers]

I believe @daniel-nagy is just closing the duplicates and pointing them back to this one.

[nevernet]

@Mechzeit ahh, i see. but i think we should close #250, because there is no discussion in that issue. :)

[daniel-nagy]

Hi all, in v0.10.0 the page dropdown uses virtualization.

[MikeSam]

@Mechzeit @nevernet Is latest version v0.10.0 solved your issue with pagination big tables? I have the same issue now with table > 2 500 000 rows.