wp_script_add_data()

Définition : wp_script_add_data() attache une information de chargement à un script WordPress déjà enregistré. Elle permet notamment de demander une stratégie defer ou async sans manipuler directement les balises HTML.

Comprendre et utiliser

À quoi sert ce terme ?

Elle complète la gestion native des ressources JavaScript pour régler finement leur mode de chargement. La fonction est utile lorsque le handle existe déjà et que sa définition initiale ne peut être modifiée aisément.

Fonctionnement technique

La fonction accepte un handle, une clé et une valeur. Pour les stratégies de chargement modernes, la clé strategy avec defer ou async est documentée ; WordPress ajuste les stratégies admissibles selon les dépendances.

Dans quels contextes l’utiliser ?

À utiliser pour un script dont les contraintes de dépendances sont connues, après son enregistrement. Préférer l’argument strategy de wp_enqueue_script() lors d’une nouvelle déclaration.

Cas concret : ATOOLPHA

ATOOLPHA souhaite différer un script propriétaire de navigation après avoir vérifié qu’il peut fonctionner sans bloquer le parsing du document.

Exemple de code commenté

Extrait PHP destiné à un plugin ou à un template WordPress, dans le contexte indiqué ; pas au contenu HTML de l’article.

<?php
add_action( 'wp_enqueue_scripts', function () {
    wp_register_script(
        'atoolpha-nav',
        plugin_dir_url( __FILE__ ) . 'assets/nav.js',
        array(), '1.0.0', array( 'in_footer' => true )
    );
    wp_script_add_data( 'atoolpha-nav', 'strategy', 'defer' );
    wp_enqueue_script( 'atoolpha-nav' );
} );

Décryptage de l’exemple

Le script est d’abord enregistré, puis reçoit une préférence defer et enfin rejoint la file. WordPress peut ajuster la stratégie finale afin de respecter les relations de dépendances.

Résultat attendu

Le script propriétaire peut être émis avec un chargement différé compatible avec les autres ressources, sous réserve de leurs contraintes.

Exercice pratique et vérification

Comparer la balise script générée avant et après strategy. Ajouter une dépendance sur un environnement de test et observer la stratégie effective.

Précautions et limites

Ne pas utiliser une stratégie async pour du code qui suppose l’ordre d’exécution avec d’autres scripts. Vérifier le HTML généré et les événements attendus.

À ne pas confondre

wp_script_add_data() modifie les métadonnées d’un script ; wp_add_inline_script() associe du code JavaScript ; les deux API diffèrent.

Diagnostic avancé

Si defer n’apparaît pas dans la source, examiner les dépendances et la stratégie admissible retenue par WordPress avant d’ajouter un filtre script_loader_tag.

Choix d’architecture et déploiement

La stratégie demandée ne doit pas être confondue avec l’attribut final imprimé. Le gestionnaire WordPress doit préserver les dépendances ; le développeur documente donc l’intention, puis vérifie le résultat concret sur la version de WordPress utilisée.

Contrôle avant intégration

Contrôler les dépendances, l’ordre d’exécution, la version WordPress et la compatibilité avec les outils d’optimisation.

Notions associées

  • Chargement différé (defer)
  • Chargement asynchrone (async)
  • wp_enqueue_script()

Références officielles

Bouton retour en haut de la page