window.Intercom n’existe pas tant que le script n’est pas chargé, et pourtant ce script se lançait sur absolument toutes les pages d’un site vitrine, y compris celles où aucun visiteur ne cliquait jamais sur la bulle de chat. Un audit de performance a révélé que ce seul script pesait plus de 45 kilo-octets non compressés, chargés en synchrone dans l’en-tête, avant même l’affichage du premier contenu utile.
La demande du client n’était pas de retirer Intercom, apprécié pour le support client, mais de ne le charger que si un visiteur manifestait une intention réelle de discuter. La solution a consisté à remplacer le chargement automatique par un lien explicite, qui déclenche l’insertion du script uniquement au clic.
Retirer le script automatique et l’enqueue habituel
La configuration standard d’Intercom repose sur un extrait de code inséré dans le pied de page via wp_footer, qui initialise le widget dès le chargement du DOM. Cette première étape consiste à retirer cet enqueue automatique pour ne garder que le code d’initialisation, sans le chargement du script lui-même.
function vitrine_retirer_intercom_auto() {
remove_action( 'wp_footer', 'intercom_script_auto', 20 );
}
add_action( 'wp_footer', 'vitrine_retirer_intercom_auto', 1 );
Selon la façon dont le script a été intégré au départ (copié directement dans le thème, ou via une extension), cette étape peut nécessiter d’éditer directement le gabarit plutôt que de retirer une action, si aucun hook dédié n’existe.
Ajouter un lien qui déclenche le chargement
Le lien « Discuter avec nous » reste visible en permanence dans le pied de page ou l’en-tête, mais son clic déclenche l’insertion dynamique du script Intercom dans le DOM, avant d’ouvrir automatiquement la fenêtre de discussion une fois le widget prêt.
document.addEventListener( 'DOMContentLoaded', function () {
var lien = document.querySelector( '#ouvrir-chat' );
if ( ! lien ) {
return;
}
lien.addEventListener( 'click', function ( e ) {
e.preventDefault();
if ( window.Intercom ) {
window.Intercom( 'show' );
return;
}
var script = document.createElement( 'script' );
script.src = 'https://widget.intercom.io/widget/APP_ID';
script.onload = function () {
window.Intercom( 'boot', { app_id: 'APP_ID' } );
window.Intercom( 'show' );
};
document.body.appendChild( script );
} );
} );
Gérer les identifiants utilisateur si le visiteur est connecté
Sur ce projet, certains visiteurs étaient des clients connectés à un espace membre, et Intercom devait reconnaître leur identité dès l’ouverture du chat plutôt que de traiter chaque conversation comme anonyme. L’initialisation du widget accepte un objet de configuration transmis via wp_localize_script() pour passer ces données côté PHP vers le JavaScript.
- Le nom et l’e-mail du visiteur connecté sont transmis uniquement s’il est authentifié, jamais en dur dans le script.
- Le hash de sécurité Intercom (identity verification) doit être généré côté serveur avec la clé secrète, jamais exposé côté client.
- Le clic sur le lien reste le seul déclencheur, y compris pour un visiteur connecté, afin de conserver le gain de performance.
Mesurer le gain réel
Le test avant/après sur cet outil de mesure de performance a montré une amélioration nette du temps de blocage du thread principal, directement liée au retrait du script au chargement initial. Le gain profite à tous les visiteurs, y compris ceux qui finissent par cliquer sur le lien de chat, puisque le script ne se charge alors qu’une seule fois, au moment où il devient réellement utile.
Un script chargé pour 2 % des visiteurs ne devrait jamais pénaliser les 98 % restants.
En résumé
Différer le chargement d’un widget tiers au clic plutôt qu’au chargement automatique de la page est une optimisation simple, applicable à de nombreux outils similaires : chat en ligne, lecteur vidéo intégré, ou widget de réseau social. La configuration côté Intercom reste strictement identique ; seul le moment de son chargement change, ce qui limite le risque de régression fonctionnelle tout en apportant un gain de performance mesurable.
