RE: RE: optimizing speed of SMIL

Wow! How cool is that? I just never thought of it before but it certainly makes sense now. Thanks  for the example and for telling me about paint-flashing. BTW, the folks who have written the pages at MDN (like https://developer.mozilla.org/en-US/docs/Tools/Paint_Flashing_Tool ) have done wonderful work!

 

Cheers

David

 

From: [email protected] [mailto:[email protected]] On Behalf Of [email protected]
Sent: Thursday, March 06, 2014 6:38 PM
To: [email protected]
Subject: [svg-developers] RE: optimizing speed of SMIL

 

  

Hi David,

Is it possible to split out the "translate center to origin" and "translate back again" transformations into separate <g> elements and then just use one animateTransform for the scale on the appropriate group? That's worked for me in the past. Typically working with transforms is faster. (In Firefox you turn on paint flashing to see what sort of area is being repainted on each frame which gives you some idea of what is happening under the hood. I've tried it with animateTransform and it has given good results.)

Long-term the idea is that user agents will implement the Web Animations model and layer CSS and SVG on top of that. Then if you optimize at the Web Animations model level the optimizations apply everywhere. It will be a while coming but eventually that should mean declarative animation of transforms in SVG also benefits from optimizations like running off main thread etc.

Also, in the future it should be possible to use transform-origin to avoid the extra translate. This doesn't work yet in Firefox (see bug 923193 https://bugzilla.mozilla.org/show_bug.cgi?id=923193) and might have bugs when used in combination with <animate> but eventually this should be the simplest and fastest approach.

Best regards,

Brian