3 ms·
What about compatibility with browsers? CSS can do a lot that JS can but sometimes it just won't work on all browsers. For example the SVG animation on the page
by theden 5y ago
What about compatibility with browsers? CSS can do a lot that JS can but sometimes it just won't work on all browsers. For example the SVG animation on the page doesn't seem to work for me?
Also for animation it depends on the use-case. Complicated animations are better suited for JS than CSS https://developers.google.com/web/fundamentals/design-and-ux/animations/css-vs-javascript https://developers.google.com/web/fundamentals/design-and-ux...
I recall trying out a complicated SVG animation and it used a decent chunk of CPU time
- ajmurmann 5y agoYep, I tried the animation in mobile safari and mobile brave. Neither browser animated it and in brave it was a black blob with colored lines on it's edges.
- StevenWaterman 5y agoHave you disabled animations (aka 'prefer reduced motion') in the accessibility options of your device? I check for that and disable animations on the site. If not, then I'd be interested in the device you're using, to try and debug the animation. You're correct though, SVG animations can be resource-intensive. There's an interesting discussion elsewhere in the comments about how best to use the developer tools to debug poor performance in animations, but it can be a struggle.