I am developing explanatory line animations using SVG/SMIL and encounter high CPU loads when watching the animations in Firefox. Are there any best practices for SVG itself and for declarative animations with regard to CPU performance? Since different viewers and browsers will yield different results I am searching for general rules of thumb which I would also hope to be translatable to the Web Animations API.
-
There's been a recent regression on SMIL performance in Firefox which is being tracked by https://bugzilla.mozilla.org/show_bug.cgi?id=1171966 – Robert Longson Jul 06 '15 at 16:15
1 Answers
You can find some references and information here
Deprecated SMIL SVG animation replaced with CSS or Web animations effects (hover, click)
Here you could see low CPU performance in Fire Fox
https://www.youtube.com/watch?v=1RK3l6H0uDU&feature=youtu.be
while Chrome work well with SMIL animations. But in nearby future, as said here in last post https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/5o0yiO440LM/59rZqirUQNwJ,
"it will probably be removed at some point in the near future"
This about SMIL support in Chrome. In Fire Fox SMIL animations has become very slow, starting with version 38, and slow animation is still not fixed(in current 39.0).
There is a chance that the Fire Fox will repair support SMIL animation in future versions, as they said:
We don't have any intention to deprecate SMIL at this stage.
but Chrome(not in 45 version, maybe later) will give to us message(when page got SMIL in it content):
CONSOLE WARNING: SVG's SMIL animations (, , etc.) are deprecated and will be removed. Please use CSS animations or Web animations instead

- 1
- 1

- 1,031
- 2
- 12
- 29