CODEWITHSUNDEEP
angularjsionic-framework
balachandar
balachandar

Reputation: 825

Performance issue in ionic framework

I have created the table with 50 rows and gave the css overflow is scroll to parent element of table. Each time of scrolling I will add 5 row in the table. It’s working fine in html. But I converted this to ionic framework, I got performance lag. Can any one suggest, why performance issue is occurring when perform DOM operation in ionic framework?

Upvotes: 0

Views: 205

Answers (2)

Harshil Shah
Harshil Shah

Reputation: 327

Instead of ng-repeat="item in items", for ionic you can use collection-repeat="item in items. It is a really optimized version of ng-repeat for ionic. For more info checkout this link: collection-repeat in ionic

Upvotes: 0

J Carv
J Carv

Reputation: 101

Remember to use the one-time-binding operator '::' in every angular directive that should execute or evaluate only once, I mean if you don't need to be watching for changes (ng-click, ng-class, ng-if, ng-switch...) and also in labels, texts, fields and stuff filled with your data.

Doing a ng-repeat with too much angular interaction can create a lot of watchers. Hence, the perfomance of your app will decrease dramatically. Imagine an ng-repeat of a portion of html with 1 ng-click, 1 ng-class and three fields. These are 5 watchers, so 5 X 50 rows are 250 watchers...

Also if your list is not going to change you can use algo :: on the ng-repeat directive. Example:

<div ng-repeat="item in ::ctrl.items"></div>

Upvotes: 3

Related Questions