Setting responsiveAnimationDuration causes flicker on resize

[JMoli]

Expected Behavior

The animation should execute without a flicker.

Current Behavior

On resize event the canvas will flicker and then the animation will follow.

Steps to Reproduce (for bugs)

https://codepen.io/elisescolaro/pen/YaGyMW

Context

If you have multiple charts on a single page (with lots of other scripts) this becomes extremely noticeable.

Environment

• Chart.js version: 2.7.2
• Browser name and version: Chrome

[etimberg]

Fiddle using the latest Chart.js that still reproduces the issue: https://codepen.io/anon/pen/xWqrzY

@simonbrunel based on the flamegraph I have an idea. It looks like the draw call fires first, then the resize happens. both use requestAnimationFrame. Perhaps we need a way to force the resize to happen first, before the draw that way we don't draw for the old animation

[kurkle]

Still the case with new new animation system: https://codepen.io/kurkle/pen/OJVNwWw