[Bug] Performance bug with date series (seconds unit step with year change)
- Dominant language
- TypeScript
- Stars
- 67.3k
- Forks
- 19.8k
- Avg merge
- 11d 14h
- Merged PRs (30d)
- 8
Description
### Version
6.0.0
### Link to Minimal Reproduction
[Link](https://echarts.apache.org/examples/en/editor.html?c=line-simple&code=PYBwLglsB2AEC8sDeAoWsBEkwBsCmGAXMmupgM4AWwA7kbGAE4CueANKelngB5gCCOCAHNo9DPgBmYDBzKYwvGcQwAVCAFs8scnkYQ85WZwVKAymACe-eqnldJMMAHU8IysswAjYDgAmxvaYjtBgZhAAXgTEAIwAbCYAvqSJcgrAvpAgtiZY-sLCeuIAhjwQRmlcinwW1tEkQRghYZH1MQDMSSlp3DVWNsR2ZE1OAGLFGhA4luJmwMyMAMZ4ZsXQ5AAKjMAY3aRYGTg-PDnyGFS09EyslenZsXG3GPke9HEALE-SeMVgC_VDM6MQxgYDA05BBQQXD1DAAJUMeDAsAiGQ0gUhGDwGhAlGK5HKEMhmAgixgtQGDWJw2qYA2wAJkBg4lB2RMQWSxM59m56G5qX2PH4ZSMg1ypXK6kWAGsicMLnRiNc8EknhLyAAZCDQAHszAwABaeh2xEkxRwuluXAVVxYKvkArO6o1xS8eBwcq42zAv3q7wArFaKNRFQw7bdHcNoBNYX5fRiuNGtABxYr3WAAdgATE8k3gNcBFr8oGIVJM_H4bE8rCBYZAtAnMHnVOZ-rrGsAAG56SQ4S4qa7QIuKRtcGgQPxgSj0LMfIMjUKudyeDA-fy7B17LiWYWEsVOkUut0ewaRrjqqWy_f2c4h22sVW5PMs7G1xi_f6NrCWWviTvm1gMUjAB6YDMDWTRi2ZJVw32XR9EMegAG0TEBGkf1hIQdVHTA4x9ZC9XQFDqUwLMAAZ4gAWhiLNKPaGJYCzdpCH9ABOFiYhw-QYjIgA6MiyPeMj2neVjWLiYSswzGJ_UI2AAF0gyIuSuHIqiaLohimJY9j_SzLiyB4_jhNYjM4gADizGJzLE94YneOTFLk4jqQwNS4mo2j6MY5i2JY9oDPQIyBPaViYjM1ihLCjNTMcpTYBc4k3IojyNO87S_P9d5AtgYLhPMtj_RiMT_XM0SEmJJziUSzF3M8zSfJ0lj_RyvL2nMiiRNKrMitY2TKvimrGjqtKtN83S4laviQozd4sysjrwv9DNzLi5yVNIlL6vS8aWIzKbjPaCyhPedqyqkjM1uqjbkvUryxqa0qDpCuIevMuJTP9MjTMugb1pI27UvuxrMtY57hP9OIIsh8KoYqyEqshIabzUjNKIo9GGIEwhsYE8H2i-gqofMniyLYxy9URs5nxUAAhYoZUUcgZHnMk-0YcQAGIYlGDMM1p7LH3kNCqgw8QsIIedyEsDQ13ERYICWKs9QwPDigI66AdRzHMdgXGyJxzj4qC6bhIDEyjrMjNSqupGbu1jGKL1g3cf043ctN9pQvm4qsq636EcG-2KLRx2sZdl2Avdtqvfab7woJsrbaCZGzgdmJdf1nHsujz2pNE2GyJ60Lk_sVPhnTzOI5xlrc8OqyodO94PqY1a_s11zK6drOyMmuuQpksyZLiOJ4is0v5HL1SQ517vq7I_b--E77IrsvTzPaLMJ7IKfNvC2fw5xl3zPxwSaKh0Kvq39u7a1mew-do-cbBpes1YyyOj68zZqL7flLv_eD8s48XBm_Ji4kspZR4tfBGlN5w00wKMMEeAizMxwhgNmYIuajF5qMMiABRDcZBuSI1Vr8YoBo0QazICLBQYsVDagJH4SWKtJjQAAGoARWCANY9A44CSlj6RgYBOE4EAioEa91VDzSanZYyZEDToLwNAPwojxF7yBppaRzFsZ5QUegvw5RXT4ACKac0ughY0JVjWWE5AhDMI5oI4owi1GwkkVomRfk5ECX0fOZRqiuHiHcfRbRT89GKPnFITwc4VYvGiZ8axrY6iemGM0cIUR6AxBiHqXksASEoESEAA)
### Steps to Reproduce
1. Create a chart with data with seconds timesteps with a year overlap (see reproduction snippet link)
2. Load the chart / play with the slider.
3.
### Current Behavior
💥 the chart is very laggy even on little data.
### Expected Behavior
The chart loading should be smooth.
### Environment
```markdown
- OS:
- Browser:
- Framework:
```
### Any additional comments?
I have run some investigations and I think there are 2 main issues.
The first one lies [here](https://github.com/apache/echarts/blob/d4ce746cd8e8663659cf3063c5b509e0b9d0de40/src/scale/Time.ts#L566). `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:
```javascript
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
Contributor guide
Assessment
This issue has not been assessed yet.