2

I am using ng-repeat to display the table-rows. Browser is not responsive when i load 1000 rows to that variable. That means validationRows contains 1000 rows means page performance is not good. have to improve the performance in ng-repeat. I have checked the below link

How to improve performance of ngRepeat over a huge dataset (angular.js)?

I don't want to use limitTo filter because i want to dispay entire records in same page at same time. I want to know how to use one -way binding in below code. Any other suggestion to improve the performance of ng-repeat.

<tbody> 
<tr ng-repeat="row in validationRows | orderBy:orderByField:sortReverse" class="dataRow" validate-data-loaded-all>
                                <td ng-repeat="column in validationColumns" ng-show="!$first" ng-class="highlight(row,column)">{{row[column]}}</td>
</tr>
</tbody>
Community
  • 1
  • 1
SivaRajini
  • 7,225
  • 21
  • 81
  • 128
  • Why even load all `1000` rows - can the client see all 1000 rows at once? If the answer is no - then load the rows incrementally on scroll. – tymeJV Sep 08 '16 at 14:21
  • Is it slow to load, **or** slow to render, **or** slow to navigate the page once it is rendered? – user115014 Sep 08 '16 at 14:26
  • I't is normal that the browser goes slow rendering 1000 records, that happens with datatables and jQuery too. I don't think it's a problem with ng-repeat performance but with the browser itself. I highly engourage you to use AJAX pagination, either scrolling or with regular pagination buttons below the table. – Alvaro Vazquez Sep 08 '16 at 14:33
  • @tymeJV yes you are right. Is there any other better suggestion like paging ? – SivaRajini Sep 09 '16 at 05:00
  • @mjwatts the browser is not responsive, it is taking 50-60 seconds to render the page – SivaRajini Sep 09 '16 at 05:01
  • @Alvaro yes that is normal fact only. Is there any other better way to show huge records in table like paging ? – SivaRajini Sep 09 '16 at 05:02
  • @SivaRajini I can't think of any. I recommendo you to use scroll pagination. In the beginning show a moderate numbe of records (let's say 50-100) and when te user scrolls down load 50 more (for example) and append them to the end of the table. Do this indefinitely until you have loaded all the records. This would be the same as Mushin is suggesting in his answer. – Alvaro Vazquez Sep 09 '16 at 06:30

1 Answers1

2

Use Infinite scroll.By using this module you can load all the rows based on scroll.

This Example will help you

Glorfindel
  • 21,988
  • 13
  • 81
  • 109
Muhsin Keloth
  • 7,855
  • 7
  • 39
  • 59