I have been trying out AngularJS and developing a mobile application to test out its features and I wanted to see if I could somehow refactor to make my JSON response hopefully quicker in fetching the data. At the moment I have a search functionality that can display from 10 to 30.000 results and usually the application takes over 2 minutes to fetch large amount of results (which is way slower than I hoped for).
I think the reason might lie somewhere where I have the for loop because I am declaring variables inside it which is probably not a good habit but I can't seem to figure out a way to remove the variables out of the loop without breaking the app.
Here is the function fetch()
to get the JSON data:
function fetch(){
$http.get("http://www.APIcall.com/phrase=" + $scope.search + "&perpage=25000")
.success(function(response){
$scope.songs = [];
$scope.details = response;
for(var i=0; i < response.tracks.length; i++){
var labelName = response.tracks[i].label_fk;
var labelLow = labelName.toLowerCase();
var resultUrl = "http://APIcall.com/stream_music_file.php?lbl="+labelLow+"&alb="+response.tracks[i].album_num+"&trk="+response.tracks[i].track_num+"";
var imgUrl = "http://www.APIcall.com/online/music/display_album_cover/"+labelLow+"/"+response.tracks[i].album_num+"";
var allTracks = {
id: response.tracks[i].track_id,
lbl_fk: response.tracks[i].label_fk,
alb_num: response.tracks[i].album_num,
track_num: response.tracks[i].track_num,
track_descr: response.tracks[i].description,
track_dur: response.tracks[i].duration,
title: response.tracks[i].primary_title,
artist: response.tracks[i].composers,
img: imgUrl,
url: resultUrl
};
$scope.songs.push(allTracks);
}
});
}
I'm pretty sure this code could be cleaned up better but I would really hope that also it might somehow be faster in fetching the data with some modifications to it.