I am working on a project for Udacity, where I should use CSV files to display data on fake corporate dashboard. Structure of the data I am working on is like this:
I am using AngularJS for this project, I created service for getting the data, formatting it to JSON and summarizing data into months. It works good, but I can see that it takes up to 1-2 sec to load a page, and data sheet has only around 90 lines. Anybody has suggestion how to speed it up?
I am also using MomentJS for formatting dates.
Service:
var getIssues = function() {
return $http.get('data/issues.csv').then(
function(response) {
return CSV2JSON(response.data);
}
);
};
this.summorizeIssues = function() {
return new Promise(function(resolve) {
getIssues().then(function(data) {
var datesarray = [];
var returnarray = [];
data.forEach(function(item) {
if (item['submission timestamp']) {
var month = moment(item['submission timestamp'], 'M-D-YY h:m a').format('MMM-YY');
if (datesarray.indexOf(month) < 0) {
datesarray.push(month);
}
}
});
datesarray.sort(function(a, b) {
return moment(a, 'MMM-YY') - moment(b, 'MMM-YY');
});
datesarray.forEach(function(date) {
var counter = 0;
data.forEach(function(item) {
var month = moment(item['submission timestamp'], 'M-D-YY h:m a').format('MMM-YY');
if (month === date) {
counter += 1;
}
});
returnarray.push({
label: date,
issues: counter
});
});
resolve(returnarray);
});
});
};
Controller:
issuesdataProvider.summorizeIssues().then(function(data) {
_this.issues = data;
_this.datesIssues = issuesdataProvider.monthstoYears(data);
_this.currentDateIssues = _this.datesIssues[_this.datesIssues.length - 1];
});
This is the result of return CSV2JSON(response.data);
:
[
{
"submission timestamp": "4-7-16 2:28 PM",
"customer name": "Tincom",
"customer email address": "[email protected]",
"description": "error 64",
"open/closed status": "open",
"closed timestamp": 0,
"employee name": "Mickie Daley"
},
{
"submission timestamp": "7-23-15 1:12 PM",
"customer name": "Tripplehow",
"customer email address": "[email protected]",
"description": "error 95",
"open/closed status": "closed",
"closed timestamp": 42208.59706,
"employee name": "Daine Whittington"
},
{
"submission timestamp": "3-8-14 1:33 PM",
"customer name": "Betadox",
"customer email address": "[email protected]",
"description": "error 94",
"open/closed status": "closed",
"closed timestamp": 41706.67644,
"employee name": "Corliss Zhang"
}]
And this how data looks after the process is done:
[
{
"label":"Jan-14",
"issues":5
},
{
"label":"Feb-14",
"issues":1
},
{
"label":"Mar-14",
"issues":7
},
{
"label":"Apr-14",
"issues":4
},
{
"label":"May-14",
"issues":2
},
{
"label":"Jun-14",
"issues":2
},
{
"label":"Jul-14",
"issues":2
},
{
"label":"Aug-14",
"issues":1
},
{
"label":"Sep-14",
"issues":1
},
{
"label":"Oct-14",
"issues":1
},
{
"label":"Nov-14",
"issues":2
}...
]