Consider to draw the video annotation timeline as a canvas

[mzur]

If the video annotation timeline contains some thousand annotation elements, it becomes rather slow to interact with (especially zooming and panning). Consider to implement the timeline as one single canvas element. Maybe this would simplify the complicated scrolling behavior of the fixed label names at the left and video time at the top, too.

[mzur]

This will likely improve the video playback performance, too! I found that the update of the video current time and the current time indicator (red line) makes the video stutter in Firefox. This becomes worse when many video annotation elements are shown in the timeline. I can imagine that this could be much faster with a single canvas element.

[mzur]

As a first step, only the current time element and current time indicator could be drawn using a canvas. This should improve rendering performance already but requires a fair amount of tweaking for the styles (e.g. reading styles from the element any applying them to the canvas). A proof of concept can be found in the video-perf branch ( #435 ).

[mzur]

Now we use ECharts we could use ZRender for the video timeline, so we don't pull in another 2D canvas library.