Comment réduire les requêtes HTTP dans WordPress : analyse et optimisation

Votre site met 4 secondes à charger, et le visiteur s’en va. Cela vous semble familier?

D’après une étude Google Research de 2023, la probabilité de rebond augmente de 32% lorsque le temps de chargement passe de 1 à 3 secondes. L’une des principales causes de ralentissement, souvent négligée, est le nombre excessif de requêtes HTTP. Elles ne sautent pas aux yeux comme des images trop lourdes ou un hébergement médiocre, mais elles s’accumulent par dizaines et, collectivement, grignotent des secondes.

Voyons précisément ce que sont ces requêtes, comment les repérer grâce à l’analyse en cascade dans GTmetrix et, surtout, comment en réduire le nombre sans nuire au fonctionnement de votre site.

💡 Aperçu rapide:

• Ouvrez GTmetrix, collez l’URL de votre site et rendez-vous dans l’onglet Waterfall pour visualiser chaque requête avec son poids et son temps de chargement
• Filtrez les requêtes par les dossiers plugins et themes pour identifier les extensions qui chargent des scripts sur toutes les pages sans nécessité
• Passez en revue 5 points de contrôle: images superflues, CSS/JS non combinés, extensions à chargement global, extensions lourdes et absence de lazy loading
• Une fois les modifications effectuées, relancez le test et comparez le nombre de requêtes avant et après

Ce que sont les requêtes HTTP et pourquoi elles ralentissent votre site

Lorsqu’un navigateur ouvre une page, il ne reçoit pas une image toute prête d’un seul bloc. Il a besoin du squelette HTML, des feuilles de styles, de chaque script, des polices, des images, et pour chacun de ces éléments, le navigateur envoie une requête HTTP distincte au serveur.

Certaines requêtes sont destinées à votre serveur (internes: images de la médiathèque, thème, extensions). D’autres partent vers des services externes (Google Analytics, vidéos YouTube intégrées, scripts publicitaires). Le navigateur les met en file d’attente et les charge.

La relation est simple: plus il y a de requêtes, plus le temps de chargement s’allonge. Mais toutes les requêtes ne se valent pas. Un petit script de suivi se charge en 20 ms, tandis qu’une image non optimisée de 500 Ko peut bloquer le chargement pendant une demi-seconde. L’objectif n’est donc pas seulement de «réduire le nombre», mais de supprimer celles qui sont inutiles et d’alléger celles qui restent.

En pratique, la différence est perceptible: un site portfolio sur un thème épuré génère 18 requêtes et s’ouvre instantanément. Un grand portail d’actualités comme le New York Times en génère plus de 200, dont la moitié sont des scripts publicitaires et de suivi. Votre site se situe quelque part entre les deux, et ce chiffre peut être réduit.

Comment analyser les requêtes HTTP: la cascade dans GTmetrix

La manière la plus claire de visualiser les requêtes HTTP est le diagramme en cascade. Il présente chaque requête sur une ligne distincte: sa provenance, son poids, le moment où son chargement a débuté et sa durée.

Outils capables d’afficher des cascades:

• Chrome DevTools intégré (onglet Network), gratuit mais limité à votre navigateur
• GTmetrix, offre gratuite, tests depuis différents emplacements, interface claire
• Pingdom Tools, similaire à GTmetrix, points de test différents
• WebPageTest, niveau de détail maximal mais plus complexe à prendre en main

Prenons GTmetrix comme exemple. Collez l’URL, lancez le test. Dans les résultats, vous trouverez l’onglet Waterfall, c’est-à-dire la cascade:

Le diagramme lui-même ressemble à ceci:

Voici ce que signifient les colonnes:

• URL, le chemin vers le fichier. Il indique quel plugin ou thème a ajouté la requête
• Domaine, votre serveur ou un domaine externe. Vous voyez immédiatement ce qui est chargé depuis l'extérieur
• Taille, le poids du fichier. Les requêtes lourdes pénalisent davantage la vitesse
• Chronologie, le moment où la requête a démarré et sa durée. La taille n'est pas le seul critère: un fichier situé au début de la chaîne bloque tout ce qui vient après

Cliquez sur le champ de recherche au-dessus du diagramme et saisissez wp-content/plugins pour ne voir que les requêtes des plugins. Dans l'exemple ci-dessous, le plugin Lightweight Social Fonts ajoute une requête de police pour fontello.woff de 22,9 Ko:

Si vous filtrez par themes, vous verrez les requêtes du thème. GeneratePress, par exemple, ne génère que 4 requêtes, ce qui est un bon indicateur pour un thème léger:

Parcourez la liste et posez-vous la question: «Ce plugin a-t-il vraiment besoin de se charger sur chaque page?» La réponse est souvent non. Nous verrons comment y remédier dans la suite.

5 Façons de réduire les requêtes HTTP dans WordPress

Après l'analyse en cascade, vous disposez d'une liste de requêtes. Voici maintenant les actions concrètes pour les réduire.

1. Supprimez les images inutiles et non préparées

Chaque image = une requête HTTP. Si une page contient 15 images et que 5 d'entre elles sont décoratives ou en double, cela représente 5 requêtes que vous pouvez supprimer sans perte de sens. Pour les images essentielles, la règle est différente: compressez et redimensionnez pour correspondre aux dimensions d'affichage. Une image de 2500px insérée dans un bloc de 700px de large charge 5 fois plus de données que nécessaire.

En pratique, une combinaison est utile: une revue manuelle (supprimez l'inutile) + un plugin de compression. Parmi les solutions actuelles, on trouve ShortPixel, Imagify, Smush. Ils compressent les images lors du téléversement dans la médiathèque et peuvent recompresser les images existantes.

2. Combinez le CSS et le JavaScript

Le thème et chaque plugin ajoutent leurs propres fichiers de style et de script. Si vous avez un thème actif, 10 plugins et quelques services externes, vous pouvez facilement accumuler 30 à 40 fichiers CSS/JS distincts. Chacun nécessite une requête HTTP séparée.

Cette technique s'appelle la concaténation (le regroupement) et s'accompagne généralement de la minification (la suppression des espaces et des commentaires du code). La plupart des plugins de performance font les deux:

• WP Rocket, plugin premium, combine et minifie le CSS/JS en quelques clics
• Autoptimize, gratuit, uniquement pour la concaténation et la minification

Important: après avoir activé la combinaison, parcourez les pages principales de votre site et vérifiez que la mise en page n'est pas cassée. Parfois, les scripts entrent en conflit lorsqu'ils sont fusionnés, auquel cas vous excluez ce fichier spécifique de la combinaison.

3. Empêchez les plugins de se charger là où ils ne sont pas nécessaires

Un formulaire de contact se trouve uniquement sur la page de contact. Mais son CSS et son JS se chargent souvent sur l'ensemble du site, ce qui représente 2 à 3 requêtes supplémentaires sur chaque page sans formulaire. Contact Form 7, par exemple, charge ses scripts globalement par défaut.

Si le plugin le permet, deux approches sont possibles:

• Remplacez-le par une alternative plus optimisée qui ne charge pas les ressources de manière globale
• Conservez le plugin mais gérez le chargement des scripts via Perfmatters, qui dispose d’un gestionnaire de scripts permettant de désactiver les CSS/JS d’un plugin sur toutes les pages sauf celles où il est réellement utilisé

Résultat: les mêmes 2 à 3 requêtes, mais uniquement sur la page de contact, et non sur l’ensemble du site.

4. Remplacer les plugins lourds par des alternatives plus légères

Après avoir filtré le waterfall par plugins, vous pouvez identifier les plugins qui génèrent le plus de requêtes. Si un plugin ajoute 8 scripts et feuilles de styles alors que son alternative s’en sort avec deux, le changement supprime 6 requêtes HTTP.

Exemples de remplacements issus de la pratique:

• Revolution Slider (lourd) → un bloc de couverture léger fourni par le thème ou MetaSlider
• Constructeur de pages avec des dizaines de scripts → l’éditeur de blocs natif Gutenberg
• Plugin social avec des appels à des API externes → icônes de liens statiques

Examinez chaque plugin listé dans le waterfall: est-il vraiment utilisé? Si un plugin n’a pas été mis à jour depuis plus d’un an ou si la fonctionnalité n’est pas nécessaire, supprimez-le complètement.

5. Activer le chargement différé (lazy loading)

Le chargement différé retarde le chargement des images et des iframes situés en dehors de la zone visible de l’écran. Le visiteur ouvre la page et seul ce qu’il voit se charge. Le reste s’affiche au fur et à mesure qu’il fait défiler la page.

Depuis WordPress 5.5, l’attribut loading="lazy" est automatiquement ajouté aux images. Cela suffit pour le scénario de base. Si vous avez besoin d’un chargement différé plus poussé (pour les iframes, les images d’arrière-plan, les vidéos), utilisez Perfmatters, WP Rocket ou l’extension gratuite LazyLoad by WP Rocket.

Vidéo: Les requêtes HTTP WordPress en 5 minutes

Une courte vidéo sur le sujet, du diagnostic à la réduction des requêtes sans plugins:

⁉️🤔 Foire aux questions

Combien de requêtes HTTP est-il normal d’avoir pour un site WordPress?

Il n’existe pas de chiffre universel. Un site propre, avec un thème léger et 5 à 7 extensions, se situe entre 25 et 40 requêtes. Un site utilisant un constructeur de pages, des scripts publicitaires et une dizaine d’extensions peut en générer entre 80 et 120. Ne vous focalisez pas sur le nombre absolu, mais sur la tendance: si vous passez de 90 à 55, c’est un bon résultat.

Les requêtes externes (Google Fonts, Analytics) affectent-elles la vitesse?

Oui, mais de manière différente. Une requête externe vers Google Fonts ajoute 1 à 2 requêtes, mais elles transitent par le CDN de Google et se chargent rapidement. Le principal problème est le blocage du rendu: tant que la police n’est pas chargée, le navigateur peut ne pas afficher le texte. Solution: préchargez les polices via preload ou hébergez-les localement.

Est-il nécessaire de fusionner tous les fichiers CSS et JS en un seul?

Pas toujours. Fusionner tous les scripts en un seul fichier donne une seule requête, mais un fichier volumineux met plus de temps à se charger. Le protocole HTTP/2 moderne peut charger plusieurs fichiers en parallèle, de sorte que 3 à 4 fichiers de 30 Ko chacun peuvent se charger plus vite qu’un seul de 120 Ko. Idéalement, fusionnez le CSS critique (ce qui est nécessaire pour afficher le premier écran) et laissez les scripts non critiques séparés avec l’attribut defer.

Que faire si la mise en page se casse après la fusion du CSS?

Excluez le fichier problématique de la fusion. WP Rocket et Autoptimize vous permettent d’ajouter l’URL d’un script ou d’une feuille de style à la liste d’exclusion. Ensuite, relancez le test. Perdre un fichier sur un ensemble de 15 requêtes est à peine perceptible.

Peut-on réduire les requêtes sans extensions?

Oui. La désinscription manuelle des scripts via functions.php offre un contrôle total, mais nécessite de comprendre les hooks de WordPress. Pour la plupart des propriétaires de sites, WP Rocket ou Perfmatters est plus simple et plus sûr: ces outils ne vous laisseront pas désactiver un script essentiel au fonctionnement.

Il est temps de faire le ménage dans vos requêtes

Les requêtes HTTP ne se règlent pas une fois pour toutes. Installez une nouvelle extension, changez de thème, ajoutez un script publicitaire, et de nouvelles requêtes apparaissent. Tous les deux mois environ, allez sur GTmetrix, ouvrez l’onglet Waterfall et comparez avec ce que vous aviez la dernière fois.

Si vous ne savez pas, à l’instant même, combien de requêtes votre site génère, ouvrez GTmetrix, collez l’URL et cliquez sur «Start Test». En une minute, vous verrez la situation réelle. Suivez ensuite les étapes décrites dans cet article. Chaque requête supprimée rapproche votre site d’un chargement en 1 à 2 secondes.