CODEWITHSUNDEEP
javascriptangularjs
Saurabh Tiwari
Saurabh Tiwari

Reputation: 5151

Way to implement lazy loading in Angular

I currently am working on a web application based on AngularJS. On few screens, I have to repeat an array object to display multiple tiles on screen. The data however is not much but the rendering on DOM is taking too much time, due to multiple directive compilation for each of the tiles. On another screen, I am using highcharts library to plot 4 series for each such object in the array.

So, to improve the performances, I am thinking on the lines to restrict DOM rendering only to view-port area. I have gone through few external libraries in jQuery that provides such implementation but I am looking for a pure and simple AngularJS based idea.

One thing I tried was using limitTo in ng-repeat. It reduces DOM manipulation to limited data. However, I am looking for a technique that would fetch data from server as and when required as per user scrolling.

Is there a simple method to do so on Client side? Should I go for handling scroll event and call server for data.

Upvotes: 0

Views: 85

Answers (1)

null
null

Reputation: 7926

An easy way to improve performance is indeed by paging the results. If you want to page items by scrolling you might want to take a look at ngInfiniteScroll.

Upvotes: 1

Related Questions