[Bug] Performance bug with date series (seconds unit step with year change) #21128
Description
Version
6.0.0
Link to Minimal Reproduction
Steps to Reproduce
- Create a chart with data with seconds timesteps with a year overlap (see reproduction snippet link)
- Load the chart / play with the slider.
Current Behavior
💥 the chart is very laggy even on little data.
Expected Behavior
The chart loading should be smooth.
Environment
- OS:
- Browser:
- Framework:Any additional comments?
I have run some investigations and I think there are 2 main issues.
The first one lies here. setMethodName can be very costly as we can see in the flame graph. My suggestion would be to update this function to take the unitName as a parameter and to compute the intervals with something like:
function getUnitStep(unitName: TimeUnit): number {
// Only return a step for units with fixed millisecond values.
// 'month' and 'year' have variable lengths and should not be handled here.
const step = ({
'week': ONE_DAY * 7,
'half-year': ONE_YEAR / 2,
'quarter': ONE_DAY * 95,
'half-week': ONE_DAY * 7 / 2,
'day': ONE_DAY,
'half-day': ONE_DAY / 2,
'quarter-day': ONE_DAY / 4,
'hour': ONE_HOUR,
'minute': ONE_MINUTE,
'second': ONE_SECOND,
// 'month' and 'year' have variable lengths and should not be handled here.
'year': ONE_YEAR,
'month': ONE_DAY * 31, // Approximate value for month
'millisecond': 1
})[unitName];
return step;
}
function addTicksInSpan(
interval: number,
minTimestamp: number, maxTimestamp: number,
getMethodName: string,
setMethodName: string,
isDate: boolean,
out: InnerTimeTick[],
unitName: TimeUnit
) {
const step = getUnitStep(unitName);
let dateTime = minTimestamp;
while (dateTime < maxTimestamp && dateTime <= extent[1]) {
out.push({
value: dateTime
});
dateTime += step * interval;
}
out.push({
value: dateTime,
notAdd: true
});
// ......
}Secondly, I am under the feeling that we are iterating a bit too much in this function based on a few console.log experiments but this might be me not understanding the full logic behind this piece of code