Un script anti-flickering ralentit-il mon site web ?
Réponse rapide
Un script anti-flickering ajoute bien une latence marginale, généralement de 50 à 150 ms, car il masque brièvement le corps de la page pendant l'application de la variante du test A/B, afin d'éviter un flash de la version d'origine. C'est généralement acceptable, mais les scripts anti-flicker mal implémentés et dépourvus de délai d'expiration peuvent bloquer indéfiniment l'affichage et nuire gravement aux scores de Largest Contentful Paint.
Points clés à retenir
- Les scripts anti-flickering doivent inclure un délai d'expiration maximal (généralement de 1 à 3 secondes) afin que la page s'affiche même si la variante ne se charge pas.
- Les outils de test A/B bien optimisés comme Mida réduisent l'impact de l'anti-flicker grâce à un chargement asynchrone rapide et à un script léger de moins de 20 Ko.
- Mesurez vos scores LCP et FCP avec et sans le script de test A/B activé afin de quantifier le coût réel en performance pour votre site.
La vitesse et les performances de votre site web doivent toujours être vos priorités absolues, car elles peuvent avoir un impact direct sur les taux de conversion et le classement SEO de votre site.
En matière de test A/B, une question revient souvent : l'ajout d'un script anti-flickering ralentira-t-il un site web ?
Dans cet article, j'explique ce qu'est un script anti-flickering, comment il fonctionne, son impact sur la vitesse du site, ainsi que quelques bonnes pratiques pour l'utiliser.
Qu'est-ce qu'un script anti-flickering ?
Un script anti-flickering, parfois appelé script de test A/B, est un code qui supprime le « flicker », ce scintillement ou flash visuel qui peut se produire lorsque vous lancez un test A/B sur votre site web.
Voici ce qui se passe lorsque vous configurez un test A/B sans script anti-flickering :
- Un utilisateur visite votre site web.
- L'outil de test A/B charge la page d'origine (version A).
- Une fois le script de test A/B chargé, il remplace la version A par la version B.
- Ce remplacement est visible par l'utilisateur et provoque un scintillement gênant entre les versions de la page.
Voici un exemple de ce à quoi ressemble un « flicker » :
Le script anti-flickering élimine ce flash en retardant l'affichage de la page à l'utilisateur jusqu'à ce que la bonne version soit chargée.
Concrètement, cela fonctionne ainsi :
- Un utilisateur visite votre site web.
- Le script anti-flickering affiche une page blanche pendant que le test A/B détermine quelle version (A ou B) afficher.
- Une fois la version attribuée par le test, le contenu complet de la page se charge de façon fluide, sans aucun scintillement entre les versions.
Et si l'outil de test A/B mettait 10 secondes à se charger ?
En général, un script anti-flickering dispose d'un paramètre de délai d'expiration que vous pouvez configurer : si le script de test A/B, pour une raison quelconque, est absent de la page ou ne s'est pas chargé en XX secondes (pas plus de 2 secondes), il libère la page en supprimant la page blanche.
Il en résulte une expérience utilisateur plus fluide.
ATTENDEZ !
Donc, vous retardez volontairement la page avec une page blanche JUSQU'À ce que le test A/B détermine quelle version utiliser ? Cela n'a-t-il pas d'impact sur la vitesse de la page ?
Comment le script anti-flickering affecte-t-il la vitesse de la page ?
L'impact du script anti-flickering dépend principalement de la rapidité avec laquelle votre script de test A/B peut s'exécuter pour déterminer la version de la page.
Plusieurs facteurs de vitesse entrent en jeu :
- La durée de la page blanche : il s'agit du temps pendant lequel la page blanche s'affiche, le temps que le test A/B détermine la version. Plus cette durée est courte, moins l'impact sur la vitesse est important.
- La vitesse en cascade : la plupart des outils de test A/B se chargent de manière asynchrone pour éviter de bloquer le chargement des autres éléments de la page. Toutefois, le script anti-flickering retardera l'affichage de la page complète jusqu'à la fin de l'exécution du test A/B.
- La géographie : l'emplacement du serveur de l'outil de test A/B peut engendrer de la latence selon la localisation de l'utilisateur. Plus la distance est grande, plus l'exécution est lente.
- La charge du serveur : une forte charge sur les serveurs de test A/B ralentit également le temps d'exécution du script.
En résumé, un script de test A/B à exécution rapide réduira au minimum la durée de la page blanche et l'impact du script anti-flickering sur la vitesse. Des scripts plus lents peuvent retarder l'affichage de la page complète et nuire aux indicateurs de vitesse du site, comme le Time to First Byte.
Comme vous pouvez le constater dans l'exemple ci-dessus, avec un script de test A/B rapide intégrant un script anti-flickering, la page s'affiche en 0,63 s. À l'inverse, si le script de test A/B est lent, peu importe que vous ayez un script anti-flickering ou non : il nuira très probablement aux conversions de votre site.
Outil de test A/B gratuit
Lancez votre prochain test A/B dans les règles de l'art
Éditeur visuel, script de 15 Ko, natif GA4 et gratuit à vie jusqu'à 100 000 visiteurs mensuels. Aucun développeur requis.
Bonnes pratiques pour le script anti-flickering
Compte tenu des enjeux de vitesse, quelles sont les bonnes pratiques pour utiliser des scripts anti-flickering ?
- Ne l'utilisez que pour les tests Above The Fold (ATF). Activez-le uniquement sur les pages dont les éléments modifiés se trouvent dans la partie ATF. Vous n'avez pas besoin d'un script anti-flickering si votre test se situe sous la ligne de flottaison, car les utilisateurs ne remarqueront jamais l'effet de scintillement.
- Ne l'utilisez que lorsque le scintillement est très visible ou gênant. Pour des modifications de page subtiles, le script peut ne pas être nécessaire.
- Choisissez un outil de test A/B RAPIDE. Les outils les plus rapides limitent l'impact et améliorent les performances globales de votre site. Si nécessaire, travaillez avec votre fournisseur.
- Réduisez la latence géographique. Utilisez un CDN pour distribuer les scripts de test A/B géographiquement.
En conclusion
Les scripts anti-flickering peuvent offrir une meilleure expérience utilisateur en supprimant les flashs gênants pendant les tests A/B. Cependant, ils peuvent retarder l'affichage du contenu de la page selon la rapidité avec laquelle l'outil de test A/B attribue la version.
Avec une implémentation bien optimisée, vous pouvez profiter des scripts anti-flickering sans sacrifier la vitesse ni les performances de votre site.
