It's been a while since I have tried working with JavaScript, so please bear with me. I am working on an application that offers reports on student data. The backend is PHP.
The database that we use for these reports has to be refreshed from time to time from a central warehouse. The refresh happens at the discretion of the end user and is not automated for various reasons not worth going into here.
The refresh takes at least 10 minutes. So it would be painful for the browser to sit there loading for that amount of time with no feedback going to the user. I figured the best way to offer feedback to the user would be through a simple JQuery script that keeps the user up-to-date on the progress of the update.
Here is the script:
var n = 0;
function increment() {
n++;
return n;
}
$(document).ready(function() {
$(#popme).click(function(event) {
n = 0;
$.getJSON('/path/to/json_pids', function(data) {
var numRecords = data.length;
$(#pop-result).html('<p>' + numRecords + ' records</p>');
$.each(data, function(row) {
$.ajax({
url: '/path/to/json_student_info/' + this,
success: function() {
increment();
$(#pop-result).html('<p>' + n + ' / ' + numRecords + ' records</p>');
}
});
});
});
});
});
What's happening in this script:
There's a div with the pop-result ID that gets updated. The /path/to/json_pids returns a JSON array of the matching student IDs.
From there, the script loops through each record and calls /path/to/json_student_info/{student_id}, but does not require anything in return. This second URL calls a script on the backend that creates/updates that student's record in the reporting database.
On success, the script is supposed to increment the number displayed in pop-result so that the user can see the progress toward completion of the script.
The result and my question
The result is a bit of a mess. The JS Console is showing a whole long line of ERR_INSUFFICIENT_RESOURCES errors. The script never makes it all the way through all the records. It might reach ~4,000 out of ~11,000 records and just die from there.
I have a feeling I'm making a rookie mistake here. I've been looking for similar scenarios over the past couple of days but haven't found anything that helps. The best idea I can find is to break the data into chunks, but I still receive the same error and behavior. Is there an alternative/better way to accomplish what I am trying to accomplish, or a way to make this script less intensive on the browser?
