I would base a decision for a particular implementation on browser support, rendering uniformity across browsers, performance, complexity of what you want to do, is it an important feature or just icing, accessibility, and general usability. Sometimes it makes more sense to use JS, and sometimes CSS only. For other types of animation, I would use transitions and @keyframes for simpler animations and certain kinds of effects, for more complex and timed animations I would JS. The nature of web dev is sometimes outcomes can be surprising, so you need to test across browsers to see what you're getting. It may be a requirement to support > 97% of browsers.
In this case, the amount of code is the same, it comes down what is more suitable for your use case. My example is consistent across browsers and has excellent browser support (SVG is native to browsers since around IE9). I am interested to test out the CSS to see how it is. You still need to create a path, which is works the same as SVG I assume? Doing this by hand is cumbersome, so you may still need to jump into an editor. The coordinate system for the path in CSS has a big question mark for me, "M20 20", what unit is 20? Is it responsive (scalable) like SVG?
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
I would base a decision for a particular implementation on browser support, rendering uniformity across browsers, performance, complexity of what you want to do, is it an important feature or just icing, accessibility, and general usability. Sometimes it makes more sense to use JS, and sometimes CSS only. For other types of animation, I would use transitions and @keyframes for simpler animations and certain kinds of effects, for more complex and timed animations I would JS. The nature of web dev is sometimes outcomes can be surprising, so you need to test across browsers to see what you're getting. It may be a requirement to support > 97% of browsers.
In this case, the amount of code is the same, it comes down what is more suitable for your use case. My example is consistent across browsers and has excellent browser support (SVG is native to browsers since around IE9). I am interested to test out the CSS to see how it is. You still need to create a path, which is works the same as SVG I assume? Doing this by hand is cumbersome, so you may still need to jump into an editor. The coordinate system for the path in CSS has a big question mark for me, "M20 20", what unit is 20? Is it responsive (scalable) like SVG?