Le lecteur audio est chargé en différé par défaut. Il ne charge pas son JavaScript ni son CSS tant que le visiteur ne fait pas défiler la page jusqu'à lui. Cela maintient un Largest Contentful Paint (LCP) rapide pour votre page.
Ce que fait le chargement différé
- Au chargement de la page, un petit espace réservé s'affiche à la position du lecteur
- Le JavaScript et le CSS du lecteur complet ne sont PAS encore chargés
- Quand le visiteur fait défiler la page à moins de 500 px du lecteur, le lecteur complet se charge et remplace l'espace réservé
- La transition est visuellement fluide (généralement en moins de 100 ms)
Pourquoi cela aide les Core Web Vitals
Sans chargement différé, chaque page avec un lecteur supporte le coût du JS et du CSS du lecteur au chargement initial. Avec le chargement différé :
- LCP : non affecté - le lecteur ne se trouve pas dans le contenu visible au-dessus de la ligne de flottaison
- INP : non affecté - aucun JS lourd ne s'exécute au chargement
- CLS : non affecté - l'espace réservé a la même hauteur que le lecteur final
Quand le désactiver
Le chargement différé est activé par défaut. Désactivez-le si :
- Votre lecteur est toujours au-dessus de la ligne de flottaison (rare)
- Vous utilisez la lecture automatique et souhaitez que le lecteur soit prêt instantanément (très rare)
- Vous voulez tester sans chargement différé pour le débogage
Comment le désactiver
- Allez dans Synthèse vocale - Avancé.
- Désactivez Chargement différé du lecteur.
- Enregistrez.
Comment cela fonctionne techniquement
- Le plugin utilise
IntersectionObserverpour détecter quand le lecteur entre dans le champ de vision - À l'intersection, il charge dynamiquement le JS et le CSS requis
- Une fois chargés, les scripts restent mis en cache dans le navigateur pour le reste de la session
Les navigateurs sans IntersectionObserver (très anciens) reviennent au chargement des scripts au chargement de la page.
Cas limites connus
Lecteur dans un élément masqué
Si votre lecteur se trouve dans une section display: none (comme un accordéon réduit), le chargement différé ne se déclenche pas tant que la section n'est pas visible. C'est généralement souhaitable - inutile de charger ce qui n'est pas affiché.
Lecture automatique audio
Si vous activez la lecture automatique sur le lecteur et qu'il est chargé en différé, il ne se lancera pas tant que le visiteur ne fait pas défiler jusqu'à lui. La lecture automatique démarre dès que le lecteur se charge.