Comment les extensions WordPress affectent le temps de chargement de votre site

Vous êtes-vous déjà demandé comment les extensions WordPress affectent le temps de chargement de votre site ? Les extensions WordPress vous permettent d’ajouter des fonctionnalités à votre site, mais elles peuvent également affecter la vitesse de votre site. Dans cet article, nous allons vous afficher comment les extensions WordPress affectent le temps de chargement de votre site, et comment vous pouvez les contrôler plus efficacement.

Comment fonctionnent les extensions WordPress ?

Les extensions WordPress sont comme des applications pour votre site WordPress. Vous pouvez les installer pour ajouter d’autres fonctionnalités à votre site, comme des formulaires de contact, des galeries de photos ou un magasin d’e-commerce.

Lorsque quelqu’un visite votre site, WordPress charge d’abord ses fichiers cœurs, puis tous vos extensions activées.

Pour plus de détails, consultez notre article sur ce que sont les extensions WordPress ? Et comment fonctionnent-ils ?

Comment les extensions peuvent-elles affecter le temps de chargement du site ?

Chaque extension WordPress offre des fonctionnalités et des avant-postes différents. Pour ce faire, certaines extensions font des appels à la base de données sur l’interface d’administration, tandis que d’autres chargent des actifs sur l’interface publique, tels que des feuilles de style CSS, des fichiers JavaScript, des images, etc.

Les requêtes de base de données et le chargement d’actifs augmentent le temps de chargement de votre site. La plupart des extensions émettent une demande HTTP pour charger des éléments tels que des scripts, des feuilles de style CSS et des images. Chaque demande augmente le temps de chargement des pages de votre site.

Lorsqu’il est effectué correctement, l’impact sur les performances n’est souvent pas trop perceptible.

Cependant, si vous utilisez plusieurs extensions qui font trop de demandes http pour charger des fichiers et des actifs, alors cela affectera les performances de votre site et l’expérience utilisateur.

Comment vérifier les fichiers chargés par les extensions WordPress ?

Pour savoir comment les extensions affectent le temps de chargement de votre page, vous devez vérifier les fichiers chargés par les extensions WordPress.

Il existe de nombreux outils que vous pouvez utiliser pour le faire.

Vous pouvez utiliser les outils développeurs/développeuses de votre navigateur (Inspect dans Google Chrome et Inspect Element dans Firefox).

Il vous suffit de vous rendre sur votre site et de cliquer avec le bouton droit de la souris pour sélectionner Inspecter. Cela ouvrira le panneau des outils développeurs/développeuses.

Vous devez cliquer sur l’onglet « Réseau », puis recharger votre site. Au fur et à mesure que la page se recharge, vous pourrez voir comment votre navigateur charge chaque fichier.

Vous pouvez également utiliser des outils tiers tels que Pingdom et GTmetrix. Entre autres informations utiles, ces outils vous afficheront également tous les fichiers chargés et le temps qu’ils ont mis à se charger.

Combien d’extensions sont-elles trop nombreuses ?

En voyant ces fichiers se charger, vous pouvez commencer à vous demander combien d’extensions devrais-je utiliser sur mon site ? Combien d’extensions sont trop nombreuses ?

La réponse dépend vraiment de l’ensemble des extensions que vous définissez sur votre site.

Une seule mauvaise extension peut charger 12 fichiers alors que plusieurs bonnes extensions n’ajouteront que quelques fichiers supplémentaires.

Toutes les extensions bien codées essaient de réduire au minimum les fichiers qu’elles chargent. Cependant, tous les développeurs/développeuses d’extensions ne sont pas aussi prudents. Certaines extensions chargent des fichiers à chaque chargement de page, même si elles n’en ont pas besoin.

Si vous utilisez trop d’extensions de ce type, cela commencera à affecter les performances de votre site.

Comment garder le contrôle sur les extensions ?

La chose la plus importante que vous puissiez faire sur votre site WordPress est d’utiliser uniquement des extensions qui sont bien codées, qui ont de bons Avis et qui sont recommandées par des sources de confiance.

Consultez notre guide sur la façon de trouver quelles extensions WordPress.

Si vous trouvez qu’une extension WordPress affecte le chargement de votre site, alors cherchez une meilleure extension qui fait le même travail mais en mieux.

Ensuite, vous devez commencer à utiliser la mise en cache et le CDN pour améliorer encore les performances et la vitesse de votre site.

Un autre facteur à prendre en compte est l’hébergeur de votre site. Si vos serveurs hébergeurs ne sont pas correctement optimisés, alors cela augmentera le temps de réponse de votre site.

Cela signifie que non seulement les extensions, mais aussi les performances globales de votre site seront plus lentes. Confirmez que vous utilisez l’une des meilleures entreprises d’hébergement WordPress.

En dernier recours, vous pouvez désinstaller les extensions dont vous pouvez vous passer. Avis sur les extensions installées sur votre site, et voyez si vous pouvez en désinstaller certaines. Ce n’est pas une solution idéale car vous devrez faire des compromis sur les fonctionnalités pour la vitesse.

Optimiser les extensions WordPress manuellement

Les utilisateurs/utilisatrices WordPress avancés peuvent essayer de gérer la façon dont les extensions WordPress chargent les fichiers sur leur site. Pour ce faire, il est nécessaire d’avoir quelques connaissances en codage et quelques compétences en débogage.

La bonne façon de charger les scripts et les feuilles de style dans WordPress est d’utiliser les fonctions wp_enqueue_style et wp_enqueue_script.

La plupart des développeurs/développeuses de WordPress les utilisent pour charger les fichiers des extensions. WordPress dispose également de fonctions simples pour désenregistrer ces scripts et feuilles de style.

Cependant, si vous désactivez simplement le chargement de ces scripts et feuilles de style, alors cela cassera vos extensions, et elles ne fonctionneront pas correctement. Pour corriger cela, vous devrez copier et coller ces styles et ces scripts dans les feuilles de style et les fichiers JavaScript de votre thème.

De cette façon, vous serez en mesure de les charger tous en même temps, ce qui minimisera les demandes http et diminuera efficacement le temps de chargement de votre page.

Voyons comment désenregistrer facilement les feuilles de style et les fichiers JavaScript dans WordPress.

Désactiver les feuilles de style des extensions dans WordPress

Tout d’abord, vous devrez trouver le nom ou la Poignée de la feuille de style que vous souhaitez désenregistrer. Vous pouvez la localiser en utilisant l’outil d’inspection de votre navigateur.

Après avoir trouvé la poignée de la feuille de style, vous pouvez la désenregistrer en ajoutant ce code au fichier functions.php de votre thème ou à une extension spécifique à votre site.

add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles() {
wp_deregister_style( 'gdwpm_styles-css' );
}

Vous pouvez désenregistrer autant de poignées de feuilles de style que vous le souhaitez dans cette fonction. Par exemple, si vous avez plus d’une extension pour laquelle vous devez désenregistrer la feuille de style, vous devez procéder comme suit :

add_action( 'wp_print_styles', 'my_deregister_styles', 100 );
function my_deregister_styles() {
wp_deregister_style( 'gdwpm_styles-css' );
wp_deregister_style( 'bfa-font-awesome-css' );
wp_deregister_style( 'some-other-stylesheet-handle' );
}

N’oubliez pas que la suppression de ces feuilles de style affectera les fonctionnalités des extensions sur votre site. Vous devez copier le contenu de chaque feuille de style que vous désinscrivez et les coller dans la feuille de style de votre thème WordPress ou les ajouter en tant que CSS personnalisé.

Désactiver les JavaScripts des extensions dans WordPress

Tout comme pour les feuilles de style, vous devrez trouver la Poignée utilisée par le fichier JavaScript pour les désenregistrer. Cependant, vous ne trouverez pas le handle en utilisant l’outil d’inspection.

Pour cela, vous devrez creuser plus profondément dans les fichiers d’extension pour trouver l’identifiant utilisé par l’extension pour charger un script.

Une autre façon de trouver toutes les poignées utilisées par les extensions est d’ajouter ce code dans le fichier functions.php de votre thème.

function wpb_display_pluginhandles() { 
$wp_scripts = wp_scripts(); 
$handlename .= "<ul>"; 
    foreach( $wp_scripts->queue as $handle ) :
      $handlename .=  '<li>' . $handle .'</li>';
    endforeach;
$handlename .= "</ul>";
return $handlename; 
}
add_shortcode( 'pluginhandles', 'wpb_display_pluginhandles'); 

Après avoir ajouté ce code, vous pouvez utiliser le code court [pluginhandles] pour afficher la liste des poignées de script des extensions.

Maintenant que vous avez des poignées de script, vous pouvez facilement les désenregistrer en utilisant le code ci-dessous :

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
wp_deregister_script( 'contact-form-7' );
}

Vous pouvez également utiliser ce code pour désactiver plusieurs scripts, comme ceci :

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
wp_deregister_script( 'contact-form-7' );
wp_deregister_script( 'gdwpm_lightbox-script' );
wp_deregister_script( 'another-plugin-script' );
}

Maintenant, comme nous l’avons mentionné précédemment que la désactivation de ces scripts empêchera vos extensions de fonctionner correctement.

Pour éviter cela, vous devrez combiner des JavaScripts ensemble, mais parfois cela ne fonctionne pas sans heurts, vous devez donc savoir ce que vous faites. Vous pouvez apprendre par essais et erreurs (comme beaucoup d’entre nous le font), mais nous vous recommandons de ne pas le faire sur un site en direct.

Le meilleur endroit pour tester est sur une installation locale de WordPress ou sur un site de staging avec des fournisseurs d’hébergement WordPress gérés.

Charger les scripts uniquement sur des pages spécifiques

Si vous savez qu’un script d’extension devra être chargé sur une page spécifique de votre site, vous pouvez autoriser le chargement d’un plugin sur cette page.

De cette façon, le script reste désactivé sur toutes les autres pages de votre site et est chargé uniquement en cas de besoin.

Voici comment vous pouvez charger des scripts sur des pages spécifiques.

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );

function my_deregister_javascript() {
if ( !is_page('Contact') ) {
wp_deregister_script( 'contact-form-7' );
}
}

Ce code désactive simplement le script contact-form-7 sur toutes les pages à l’exception de la page de contact.

C’est tout pour l’instant.

Nous espérons que cet article vous a aidé à apprendre comment les extensions WordPress affectent le temps de chargement de votre site. Vous pouvez également consulter notre guide ultime pour améliorer la vitesse de WordPress et les performances de votre site.

Si vous avez aimé cet article, veuillez alors vous abonner à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.