Help with proper crossbrowser SVG animation

[rojus32]

Hi.

I can't seem to make GSAP run well on Safari. I made a simple example which runs smooth in IE, Chrome, Firefox except for Safari, where it ends up choppy. 

I've seen this happen not only with GSAP, but js in general, where it just can't refresh fast enough, though I don't know what's that about. 

 

I'm fairly new to coding and I would appreciate any help on how to do SVG animation properly for all the browsers.

 

 

Thank you,

 

Rojus.

See the Pen yoejKb by rojus (@rojus) on CodePen

[Jonathan]

Hello @rojus32 and Welcome to the GreenSock Forum!

 

I tested on an iPad Air 2 on latest Safari (Safari 10 on iOS 10.3) and i'm seeing it animate smooth.

 

What device and Safari version are you seeing this choppy stuff going on?

 

The only thing i see in your code is that your not declaring your variable element with var. That is throwing an exception reference error in the console due to not declaring your variables with var, let or const.

 

[rojus32]

Hi.

I see.. it must be my browser, I'm running Safari 5.1.7 on windows.

Maybe you know some good alternative to test compatibility?

[Carl]

Safari for Windows hasn't been updated since 2011. 

https://en.wikipedia.org/wiki/Safari_(web_browser)

 

Probably worthwhile to drop it entirely from your tests.

[rojus32]

Guess so, need to find some alternative though.