Currently, we recalculate the positions of lines, markers, and the shapes themselves even when they are outside the bounds of the viewport. To minimize this problem we should use the concept called virtualization.
There are many approaches to this, but the most important part is that we should probably only query the selectable points with some margin. The next part is that we currently loop through all shapes in the SVG DOM linearly when we render them. This means that we have to go through all the first hierarchy shapes even the ones we don't render. Instead, we should speak to store the shapes in a tree structure so that we only need to traverse some constant number of paths from the root to render the visible shapes. One such tree is a KD-tree. But before going with this approach I need to make some preliminary analysis of what number of shapes this would be faster for and in which scenarios it applies if any.
Currently, we recalculate the positions of lines, markers, and the shapes themselves even when they are outside the bounds of the viewport. To minimize this problem we should use the concept called virtualization.
There are many approaches to this, but the most important part is that we should probably only query the selectable points with some margin. The next part is that we currently loop through all shapes in the SVG DOM linearly when we render them. This means that we have to go through all the first hierarchy shapes even the ones we don't render. Instead, we should speak to store the shapes in a tree structure so that we only need to traverse some constant number of paths from the root to render the visible shapes. One such tree is a KD-tree. But before going with this approach I need to make some preliminary analysis of what number of shapes this would be faster for and in which scenarios it applies if any.