Résumé IA
Souhaitez-vous accélérer le temps de chargement de votre page en optimisant le chargement de reCAPTCHA ? En différant le script reCAPTCHA jusqu'après le chargement du contenu de votre page, vous pouvez améliorer la vitesse initiale de la page et l'expérience utilisateur. Cette approche garantit que votre contenu essentiel apparaît rapidement tandis que les fonctionnalités de sécurité se chargent de manière transparente en arrière-plan.
Ce guide vous montrera comment retarder le chargement de reCAPTCHA pour de meilleures performances.
Comprendre le report de script
Lorsque reCAPTCHA se charge normalement, il peut interrompre temporairement le chargement d'autres ressources. En reportant le script, vous permettez d'abord au contenu essentiel de votre page, comme le texte et les images, de se charger. Cela crée une expérience plus fluide pour vos utilisateurs tout en maintenant les avantages de sécurité de reCAPTCHA.
Ajouter le code de report
Pour reporter le chargement de reCAPTCHA, ajoutez cet extrait de code à votre site. Si vous avez besoin d'aide pour ajouter du code personnalisé, veuillez consulter notre tutoriel sur l'ajout d'extraits de code.
Ce code fonctionne en identifiant le script reCAPTCHA et en ajoutant les attributs defer et async. Ces attributs indiquent au navigateur de :
- Charger le script de manière asynchrone, sans bloquer les autres ressources
- Exécuter le script uniquement après le chargement complet de la page
Utilisation avec hCAPTCHA
Si vous utilisez hCAPTCHA à la place de reCAPTCHA, utilisez cette version alternative :
function wpf_hcaptcha_add_async_defer( $tag, $handle ) {
if ( strpos( $tag, 'hcaptcha.com/1/api.js?onload=wpformsRecaptchaLoad' ) !== false ) {
$tag = str_replace( ' src', ' defer async="async" src', $tag );
}
return $tag;
}
add_filter( 'script_loader_tag', 'wpf_hcaptcha_add_async_defer', 99, 2 );
Et c'est tout ce dont vous avez besoin pour reporter le JavaScript de reCAPTCHA. Ensuite, souhaitez-vous également changer le thème de reCAPTCHA ? Consultez notre tutoriel sur la modification du thème CAPTCHA pour plus de détails.