Optymalizacja animacji SVG

Bazując na tym prostym tricku http://jakearchibald...ne-drawing-svg/ próbowałem stworzyć animację szkicu linii produkcyjnej dla swojej firmy. Coś w tym stylu: http://jsfiddle.net/...moo83/fc83a4t0/

O ile animacja w tej formie działa nawet nieźle to objętość kodu jest już spora. Przy bardziej skomplikowanym pliku SVG mam do czynienia z kilkuset liniami kodu, który od razu zawiesza mi przeglądarkę przy próbie animacji. Jest jakaś mozliwość zoptymalizowania takiego pliku? Czy może po prostu "ten typ tak ma" i SVG to nie jest dobry sposób na robienie tego typu animacji. Od razu zaznaczam, ze odpadają rozwiązania typu Flash bo z założenia ma to działać pod każdą przeglądarką/systemem.

EDIT: Animacja nie działa pod IE ale nad tym się bede głowił później

Edited by przemoo83, 22 April 2015 - 11:58 .

SMIL jest dobry do prostych, zapętlanych animacji. I tak samo jak css keyframes nie nadaje się do (a)synchronicznej animacji wielu elementów.

Do tego co chcesz osiągnąć nadaje się wyłącznie javascript. A konkretniej gotowa biblioteka, która załatwi prawie wszystko

do wyboru:

http://snapsvg.io

http://www.greensock.com/gsap-js/

http://julian.com/research/velocity/
 

choć to nie wszystkie, a na dodatek tylko ułatwiacze w miejsce zastosowania m.in. jquery

Hmm..szkoda bo wszystkie grafiki mam już przygotowane w tym zapisie więc robiłem tylko kopiuj/wklej. Tych bibliotek nie znam ale o Snap słyszałem dużo dobrych opinii. Nawet tu na forum mi polecano, wiec pora się w końcu zagłebić

Hmm..szkoda bo wszystkie grafiki mam już przygotowane w tym zapisie więc robiłem tylko kopiuj/wklej. 

Przygotowanym SVG nic nie będzie. To przecież nie binarka tylko goły txt, na którym wykonywane są wszystkie animacje przy użyciu powyższych jsowych "biblioteczek"

Aaa że w ten sposób   myślalem, że będzie potrzeba jakiegoś całkowiecie nowego "przerenderowania" tych grafik. Jak tak to git

Aaa że w ten sposób   myślalem, że będzie potrzeba jakiegoś całkowiecie nowego "przerenderowania" tych grafik. Jak tak to git

Obędzie się tutaj bez gita ;p taki suchar

Masz +1 za suchara

Jeszcze takie coś mi się przypomniało:  http://codyhouse.co/...h-css-and-snap/

#css:

https://cssanimation.rocks/buffer/

#css:
 
https://cssanimation.rocks/buffer/