search

biigle / core

:large_blue_circle: Application core of BIIGLE
https://biigle.de
GNU General Public License v3.0
13 stars 15 forks source link

Consider to draw the video annotation timeline as a canvas #417

Open mzur opened 2 years ago

mzur commented 2 years ago

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 commented 2 years ago

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 commented 2 years ago

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 ( https://github.com/biigle/core/pull/435 ).

mzur commented 2 years ago

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