I’m working on a project with a couple of lottie animations that use canvas render for rasterized assets. These animations are shown on a cms template page and I therefore use conditional visibility to show the right lottie animation according to what page the user is seing.
My problem :
• All the lottie animations present on the page are loaded with page load. Therefore even if non are visible, they will all load and show in the network waterfall. (Big problem for page speed)
• If I use jquery load to only load the animations that will be shown the lottie animation doesn’t render
Is there a way to .remove() or lottie.destroy() the lottie animations that are in a parent div with .w-condition-invisible ?