Angularjs receives request for huge json file

I need to display some data from the database to the user. The data is in a json file and is quite large. The json file size is approximately 15 MB. I created a service and used the promise api to make a successful request and load the data and show it to the user by doing ng-repeat on the div. Now, as you understand, the page will only show data when the file is available, and receiving a request to receive a 15 MB file will take a tremendous amount of time. In some cases, Firefox simply stops loading the file after a while. Now my question is Angular's way to accomplish such a task.

I'm going to do something like the first, showing only a few entries from the json file, and then when scrolling through the rest of the page, the remaining data will be filled, but I think I won, perhaps because when it receives the request, it will fully load first file and then display the data?

Angular provides something called ng-cloak, but this is just for flickering avoidance. Is there something like ng-cloak in Angular that I can use? Any other ideas or ways to solve such scenarios or what is Angular way to accomplish this?

+6
source share
2 answers

Based on your requirements, deal with the huge JSON payload. FWIW you have two options:

  • The server supports HTTP / JSON streams :

    create an angular oboe.js handler

  • Your server does NOT support HTTP / JSON streams

    Do what everyone else offers, and provide access to this payload paginated so that the browser can load it into pieces on demand.

+5
source

Make your backend deliver the file in chunks so that your angular frontend can extract some of it at a time.

Sort of:

/ Backend / getentries skip = 500 &? Count = 100

The backend is called on your external interface many times to calculate the passes and the results are added that you return to what you already have in the interface.

+1
source

All Articles