I have a asynchronous data I am loading from Firebase Firestore with this function
graphDataSubscription;
//dataCounter;
passTotalCalData;
totalCalories;
dates=[];
caloriesData=[];
getGraphDateCalories() {
if(this.graphDataSubscription){
this.graphDataSubscription.unsubscribe()
}
this.graphDataSubscription = this.mealService.grabMealGraphDataCalories(this.startDate, this.gatheredUid.uid).subscribe(items => {
this.dates = []
this.passTotalCalData = []
//this.dataCounter = 0;
this.totalCalories=0;
this.caloriesData=[];
items.forEach( item => {
//this.dataCounter++
var data: any = item.data()
this.passTotalCalData.push(data.calories)
this.caloriesData.push(data);
this.totalCalories += data.calories;
this.dates.push(moment(data.date).locale(window.navigator.language).format("DD MMM"))
})
console.log("data acquired");
this.calendarData = this.getCalendarData();
this.calendarData = [...this.calendarData];
})
}
then I am trying to insert gathered values to an object to show in a chart which requires a specific object format. It is a HeatMap chart so it must include whole previous year days even there is not a data for each day. like in this link
this is the function I am doing the date comparison, It takes almost 12 seconds even if the asynchronous data is gathered within a second.
calendarData: any[] = [];
getCalendarData(): any[] {
//console.log("begin")
// today
const now = new Date();
const todaysDay = now.getDate();
const thisDay = new Date(now.getFullYear(), now.getMonth(), todaysDay);
// Monday
const thisMonday = new Date(thisDay.getFullYear(), thisDay.getMonth(), todaysDay - thisDay.getDay() + 1);
const thisMondayDay = thisMonday.getDate();
const thisMondayYear = thisMonday.getFullYear();
const thisMondayMonth = thisMonday.getMonth();
// 52 weeks before monday
const calendarData = [];
const getDate = d => new Date(thisMondayYear, thisMondayMonth, d);
for (let week = -52; week <= 0; week++) {
const mondayDay = thisMondayDay + week * 7;
const monday = getDate(mondayDay);
// one week
const series = [];
for (let dayOfWeek = 7; dayOfWeek > 0; dayOfWeek--) {
const date = getDate(mondayDay - 1 + dayOfWeek);
// skip future dates
if (date > now) {
continue;
}
// value
var value = 0;
console.log("assigning to the object begins")
this.caloriesData.forEach(data => {
if (data["date"] === date.toLocaleDateString('en-CA')) {
value = data["calories"];
//console.log("condition granted");
return;
}
});
console.log("assigning to the object ends")
series.push({
date,
name: weekdayName.format(date),
value
});
}
calendarData.push({
name: monday.toString(),
series
});
}
return calendarData;
}
I know this is too much code but I wasn't sure how to create a minimal example with this specific problem. So is there a way to make this comparison faster?
this part is taking so long I mean it's a for each with in two nested for loops but I still don't understand why comparing these dates takes so much time
var value = 0;
console.log("assigning to the object begins")
this.caloriesData.forEach(data => {
if (data["date"] === date.toLocaleDateString('en-CA')) {
value = data["calories"];
//console.log("condition granted");
return;
}
});
console.log("assigning to the object ends")