Écran de démarrage Discourse avec des images SVG personnalisées

J’ai d’abord essayé d’utiliser des SVG animés pour l’écran de chargement. Bien que cela fonctionne sur ordinateur, j’ai constaté que sur mobile, l’animation de chemins complexes ou d’éléments internes au SVG entraînait des ralentissements, voire l’arrêt complet de l’animation.

Pour garantir une expérience fluide, j’ai déplacé la logique d’animation vers un conteneur HTML standard (div) englobant le SVG. En appliquant les animations CSS (transform, scale, opacity) à la div enveloppe plutôt qu’au SVG, les navigateurs mobiles peuvent utiliser l’accélération matérielle bien plus efficacement, sans ralentissement.

5 « J'aime »