How to speed up complex SVG drawing?



I am preparing school timetable for two week (odd week, even week). Both SVGs are complex, appear dynamically (data for every school lesson are stored in JS as object). Inside SVGs are dynamically generated rectangles (by ng-repeat), the same with the text (every class should contain five texts, by ng-repeat).

This is why there is a lag, aprox. 2-3 seconds to display full SVGs.

Is there ANY solution to speed up the time of the creation of SVGs?


First you try this to optimize your SVG files.
And why don’t you load the text content first and delay the svg load a bit.



I can NOT optime SVG because it is created dynamically; it is not static one. Load the text first? What do you mean? The text is inside all rectangles (each rectangle represents one lesson).