Ion Tindercards- Improve $http/API loading


I’m using the ionic Tinder cards (here- which are excellent.

I have configured them with an $http, which works fine when I told the factory to pull individual items (ie not in a json list).

However, I now have items coming through in a list. It is very very inefficent, buggy and slow. Images randmonly load and appear out of their div. Pulling just json object at a time works fine- but it isnt’ suitable for our server.

On a plunker:

Can some please help me improve its’ performance?


A little late here, but hoping this trick helps others looking to improve performance and reduce lags when swiping a card.
The problem here is iterating on whole data at a time loads too much images in the DOM which makes it laggy. Instead try making an array of about 5 elements at a time from your data and use ng-repeat to iterate over that array.
Something like

$scope.cardDestroyed = function (index) {

and then iterating

ng-repeat="card in Mylist"

hope this helps someone.