I recently made an animation which recently had quite good feedback from the codepen community (https://codepen.io/alaricweb/pen/vWxPyp ). I too feel like there is something very cool in this animation but the perf are really bad on mobile.
I don't blame GSAP for that it's pretty amazing already to be able to have such result with that few lines !
But now i want to be able to use this kind of animation in a real website but with that impact on perf it's not imaginable.
I don't think i can improve the perf significantly with SVG only, if i animate less stroke, the result won't be as cool.
So i'm currently looking to an alternative to have the same animation but with improved perfs !
After some research i'm starting to think that animating inside a canvas is my best option.
I feel like PixiJS could be a good option with some tricks, maybe threeJS too.
I saw @OSUblake pen in which we can see that he is using GSAP morphing inside the canvas and the perf are just incredible compared to mine.
You can see for yourself here.
So if any of you know if it's possible to have my animation inside a canvas and with what method i could try to make it better i'd be thankful for some guidelines.