Chart.js: v2.5.0 performance issue?

[activeperception]

Hi,

My simple app (angular2) is noticeable slower (loading?/rendering? not sure) after updating to 2.5.0. Anyone experiencing the same issue?

I'll try to put together a jsfiddle.

[etimberg]

@activeperception please put together a fiddle. I don't think we've done anything to make it slower. Which version did you upgrade from?

[frdteknikelektro]

Yes this is true, it even crashing browser. But it's okay after downgrading to 2.4.0

[etimberg]

@frdteknikelektro do you have a test case we can debug?

[frdteknikelektro]

Here, , , I think the problem is when you try to render Chart in parent that display style is none.

https://jsfiddle.net/frdteknikelektro/9pgs9qo9/ <-- Using 2.4
Try to change it to 2.5

[etimberg]

Looks like what's happening is that the chart renders even though it has no size. That shouldn't happen

[frdteknikelektro]

So what do you think? It's okay from until 2.5

[etimberg]

Yes, I'm not sure what changed in 2.5 to change this. I'm looking through the history to see

[etimberg]

@simonbrunel thoughts on this?

[simonbrunel]

Seems to be caused by the time scale (loop over scaleSizeInUnits == 2674800000 at construction time - update). The chart has no size, but still need to be updated so I guess this issue needs to be fixed at the time scale level.

Maybe @tredston can have a look since the time scale implementation changes a lot in #3914 and might have fixed this issue as well.

[tredston]

Looks like me.width has changed in this example case from 0 to be negative, which results in the tickUnit staying on milliseconds instead of bumping up to larger intervals.

Unfortunately it looks like the negative width causes #3914 to get stuck in an infinite loop.

Edit: Seems like this change causes the y-axis to have a positive width, while before it was set to me.maxWidth = 0. This scale's width ends up making the chart's width negative when calculating the layout.

[andr31]

Seems indeed that this problem persists only when using the time scale . I had to search everywhere and remove all display:none props from the chart container in order to solve the freezing problem.

[etimberg]

Resolved in #4105