Les 10 paramètres les plus importants de votre performance sur WordPress

Torben Simon Meier Dernière mise à jour : 29.03.2021
10 Min.
WordPress  Performance : Les 10 paramètres les plus importants
Dernière mise à jour : 29.03.2021

Le web regorge de conseils et d'astuces pour optimiser vos performances sur WordPress . Malheureusement, les explications et les évaluations de la pertinence des différentes vis de réglage tombent rapidement sous la table. Nous vous montrons les points de départ importants et les vis de réglage - dans un ordre raisonnable et avec le contexte. Ainsi, vous pouvez obtenir des résultats particulièrement rapides.

Entre-temps, nous avons déjà hébergé environ 15 000 projets WordPress . Au cours de ce processus, un grand nombre de données se sont accumulées. Et les clients nous demandent sans cesse comment ils peuvent encore réduire le temps de chargement des pages de leurs projets WordPress . Nous avons donc systématiquement traité les résultats de l'analyse des sites de nos clients au cours des dernières années. Le résultat : 10 mesures avec lesquelles vous pouvez rapidement et facilement optimiser votre performance WordPress .

Une chose en particulier est importante : certains utilisateurs sont rapidement rebutés par les suggestions d'optimisation d'outils comme Google PageSpeed Insights. Laissez-moi vous dire : Ce n'est pas avec des mesures d'optimisation compliquées que vous gagnerez le plus de temps de chargement, mais avec des méthodes faciles à mettre en œuvre.

Suggestions d'optimisation des performances WordPress par Google
Seuls quelques opérateurs de page peuvent faire quelque chose de concret avec ce message. Il est donc particulièrement important que vous vous concentriez d'abord sur les mesures d'optimisation simples et que vous ne vous attaquiez aux mesures plus compliquées que dans un deuxième temps.

Bien sûr, l'optimisation du temps de chargement n'est pas une fin en soi. Outre une meilleure expérience pour vos utilisateurs, un temps de chargement plus court apporte également des avantages dans la visibilité de votre offre dans Google. C'est pourquoi je vais également décrire brièvement les différentes étapes d'optimisation afin de créer le contexte approprié.

Théoriquement, vous pouvez travailler de haut en bas et améliorer le temps de chargement de votre page pas à pas. Au fait, les sept premiers points font également référence aux suggestions d'amélioration typiques de Google PageSpeed Insights, que nous approfondissons dans cet article, par exemple.

#N°1 La mise en cache - le facteur de performance le plus important de tous

La mise en cache signifie que votre page n'a pas à être demandée par le navigateur depuis le serveur web et ensuite construite pas à pas. Au lieu de cela, votre page est chargée - prête à être rendue - à partir d'un cache.

L'avantage de cette mise en cache est évident : WordPress ne doit pas recalculer votre page à chaque chargement de page. Comme WordPress est basé sur le très lent PHP, un cache est élémentaire. Parce qu'il empêche, entre autres, que le PHP doive être lu.

En principe, il existe deux variantes de mise en œuvre pour les caches :

  • À propos de la mise en cachePlugins: La majorité des utilisateurs utilisent une mise en cachePlugin, telle que W3 Total Cache ou WP Super Cache. Celles-ci sont parfois plus faciles, parfois un peu plus compliquées à mettre en place. En tout état de cause, un certain travail manuel est nécessaire dans ce cas.
  • À propos de l'hébergeur : Certains hébergeurs - dont RAIDBOXES - proposent une mise en cache côté serveur. Cela signifie que vous pouvez presque toujours vous passer de la mise en cache dePlugins . Parce que votre hébergeur a déjà pris en charge la configuration du cache pour vous.

Si vous avez mis en place une mise en cache performante, vous avez déjà fait le pas le plus important vers une meilleure performance de WordPress . Pour plus de détails, consultez notre article sur les bases de la mise en cache.

#2 WordPress ranger - la commande doit être

L'une des causes les plus fréquentes de la longueur des temps de chargement est - d'après notre expérience - une installation WordPress surchargée. Et comme ce point d'amélioration n'est pas mentionné par Google PageSpeed Insights , il vient directement en deuxième position dans mon top 10.

Une installation WordPress surchargée signifie dans la plupart des cas : trop de Plugins sont installés. En gros, moins il y a de Plugins, plus la page est rapide. Bien sûr, Plugins est important et vous ne pouvez pas vous en passer, mais vous devez toujours vérifier de quel Plugins vous avez vraiment besoin.

Et : vous devez vous assurer de ne pas simplement désactiver Plugins , mais de le supprimer complètement.

Améliorer les performances deWordPress  : L'aperçu de vos plugins vous indique exactement combien de Plugins vous avez installé, activé et devez encore mettre à jour.
Votre aperçu de Plugin vous montre exactement combien de Plugins sont actuellement désactivés. En principe, il devrait toujours y avoir un zéro à "Inactif". Si ce n'est pas le cas, demandez-vous exactement : ai-je besoin de désactiver Plugin ?

Il en va de même pour Themes: il n'en faut pas plus d'un.

Le contexte est le suivant : chaque Plugin et chaque Theme ajoute du code PHP à votre page. Cela s'applique également aux sites désactivés Plugins. Ainsi, votre page devient tout à fait plus volumineuse et donc plus lente (et plus vulnérable aux attaques). Cela s'explique par le fait que le PHP est un langage de script très lent. Moins il y en a, mieux c'est.

Souvent, les sites Plugins et Themes , qui ne sont plus nécessaires, sont des vestiges de tests fonctionnels et de conception. Il est donc conseillé de nettoyer régulièrement vos pagesWordPress et de tester les nouvelles fonctions et conceptions dans un environnement de test et non sur la page en direct. De cette façon, vous pouvez éviter d'avoir trop de restes de Plugin en premier lieu.

#Images n°3 : le frein à temps de chargement sous-estimé

L'une des mesures les plus efficaces et les plus simples pour réduire le temps de chargement des pages consiste à réduire la taille des images. Car ici, vous pouvez parfois enregistrer de grandes quantités de données. Avec la compression dite "sans perte", la taille des fichiers de vos images est réduite sans perte de qualité visible. Ainsi, votre page ne change pratiquement pas, alors que vous pouvez en même temps réduire considérablement sa taille grâce à l'optimisation de l'image.

HTTP Archive estime que les images constituent régulièrement la plus grande partie du trafic d'un site web. La réduction de la taille de vos images devrait donc être l'une des premières étapes de l'optimisation. Vous pouvez soit faire l'optimisation des images manuellement, soit utiliser un outil de compression Plugin.

L'utilisation de Plugin est certainement la solution la plus confortable. En effet, Plugins vous permet non seulement de compresser de nouvelles images et leurs vignettes, mais il prend également en charge automatiquement toutes les images existantes sur votre site. Toutefois, ce service est souvent payant.

#4 CSS et JavaScript - semble volumineux, mais est facile à optimiser

La deuxième plus grande quantité de données sur votre page est généralement constituée de fichiers JavaScript et CSS. C'est là que beaucoup d'utilisateurs ont peur de s'impliquer. Mais même sans expertise en matière de code, vous pouvez facilement comprendre en quoi consiste l'optimisation du CSS et du JavaScript. Parce qu'en principe, il y a trois choses à faire ici :

  • Résumez : Les CSS et JavaScript sont cachés dans de nombreux petits fichiers individuels. Normalement, chacun de ces fichiers doit être demandé individuellement au serveur web par le navigateur. Cela génère des requêtes HTTP qui ont tendance à augmenter le temps de chargement de votre page. Cependant, si les scripts sont combinés, le nombre de fichiers à charger est réduit et donc le nombre de demandes. Par exemple, 53 demandes individuelles deviennent un peu plus d'une douzaine. Bien entendu, Pluginspeut également le faire pour vous.
  • Réduire : Les fichiers CSS et JavaScript sont des lignes de code qui permettent d'activer certaines fonctionnalités et conceptions sur votre page. Ce code est écrit par des humains. Cependant, il est lu par des machines. En quoi cela est-il pertinent ? Une grande partie de ce dont un humain a besoin pour comprendre correctement le code, un ordinateur ne le comprend pas. Les espaces, les commentaires, etc. ne sont donc pas nécessaires pour que votre page soit construite correctement. C'est là qu'interviennent les sites Plugins comme Autoptimize. Ils convertissent le CSS et le JavaScript d'un code lisible par l'homme en un code lisible par la machine. Les paquets de données individuels sont ainsi plus petits et leur transmission plus rapide.
  • Compresser : Après avoir résumé et réduit, la dernière étape consiste à comprimer les paquets de données qui sont envoyés du serveur web au navigateur. Cela signifie que le serveur minimise la taille des fichiers des requêtes individuelles et que le navigateur les décompresse et les calcule. C'est plus rapide que l'envoi de paquets de données non compressés. Vous pouvez configurer une telle compression GZIP par exemple via la mise en cache -Plugins, via les paramètres manuels dans le .htaccess ou votre hébergeur a déjà activé une compression du côté du serveur.

Même sans connaissance des scénarios, il est facile de comprendre ce que les mesures individuelles apportent. Et pour ces trois étapes, il y a Plugins, qui permet même aux profanes d'optimiser les CSS et JavaScript. Dans notre article sur l'optimisation CSS et JavaScript, nous expliquons plus en détail et présentons divers Plugins .

Quatre victoires !

Ce sont les quatre domaines dans lesquels nos clients ont pu économiser un temps de chargement particulièrement important. Avec relativement peu d'efforts, vous pouvez améliorer considérablement les performances de WordPress en mettant en cache, en optimisant les images, en optimisant les CSS et JavaScript et en nettoyant WordPress .

#5 Sans hébergement, tout n'est rien

Les quatre premiers champs d'optimisation promettent une réduction particulièrement importante du temps de chargement, mais peuvent être réduits à néant si votre hébergement vous ralentit. Il ne s'agit pas tant de la configuration matérielle requise pour WordPress , mais plutôt de certaines technologies qui vous montrent qu'un hébergeur vous permet d'optimiserWordPress en conséquence.

En règle générale, vous pouvez vous rappeler que les artistes WordPress Hosting devrait disposer de ces données clés :

  • Disque dur SSD
  • Limite de mémoire PHP d'au moins 64MB, mieux 128MB
  • Centre de données en Europe
  • Version actuelle de PHP (7.4)
  • HTTP/2 et certificat SSL gratuit

Ensuite, il y a la différence entre l'hébergement partagé et le fait d'avoir son propre serveur (virtuel).

Avec l'hébergement mutualisé, vous partagez le serveur et sa puissance de traitement avec d'autres sites. Habituellement, quelques dizaines à quelques centaines. Avec votre propre serveur, vous n'avez pas à partager la puissance de calcul avec qui que ce soit. Elle offre donc l'avantage d'une sécurité de performance.

Bien qu'un serveur propre ne soit pas synonyme de plus de performances, l'expérience montre que les tarifs d'hébergement bon marché, qui ne coûtent que quelques euros par mois, ne peuvent pas rivaliser avec les serveurs virtuels en termes de performances.

Les points les plus fins - moins de punch, plus d'effort

Tous les domaines liés aux performances que j'ai mentionnés jusqu'à présent peuvent être optimisés par pratiquement tous les utilisateurs de WordPress . Soit via Plugins, par simple essai et erreur ou par l'achat de produits appropriés. La situation se complique si vous avez déjà optimisé ces domaines. Car il faut alors pénétrer plus profondément dans la structure latérale. Et les mesures d'optimisation individuelles n'ont plus le même impact.

#6 Renderblocking - mauvais ordre de chargement

Un problème dont des outils comme Google PageSpeed Insights se plaignent toujours est un ordre de chargement qui bloque le rendu.

Le problème devient clair avec un exemple : un curseur est constitué d'images et de la commande d'animation qui fait tourner ces images. Si la commande JavaScript est chargée en premier et les images en dernier, alors votre page a déjà la fonction de curseur, mais pas les images qui doivent être affichées. La page prend donc plus de temps à charger. Cette condition peut être évitée grâce à un ordre de chargement correct.

Bien qu'il existe des outils pour optimiser l'ordre de chargement Plugins, notre expérience montre qu'ils ne sont pas toujours en mesure d'optimiser entièrement votre page. En fait, les meilleurs résultats dans un tel cas sont généralement obtenus par un concepteur de sites web qui connaît bien la page et ses fonctions.

#7 Au-dessus du pli - optimiser la zone visible de la page

En plus du temps de chargement total de votre page, le temps de chargement perçu est crucial. C'est-à-dire le temps qu'un visiteur de votre site perçoit comme temps de chargement. Ce temps de chargement perçu peut être raccourci grâce à quelques astuces. Ainsi, l'utilisateur a l'impression que la page est déjà entièrement construite, bien qu'elle soit encore calculée en arrière-plan.

L'optimisation de l'ordre de chargement est particulièrement importante pour l'optimisation de cette zone, connue sous le nom de " Above the Fold ". Cela signifie qu'il faut donner la priorité aux contenus et aux caractéristiques que vous voulez que vos visiteurs voient sur la première taille d'écran.

WordPress  Performance : Image du pliage de raidboxes.de
La zone supérieure est affichée au visiteur de raidboxes.de sans défilement. C'est ce qu'on appelle le "Above the Fold". Pour toute information complémentaire, le visiteur doit interagir avec la page et la faire défiler.

Vous pouvez y parvenir, par exemple, en optimisant l'ordre de chargement. Mais il y a aussi Plugins, qui permet de charger votre page plus efficacement. Et seulement la zone visible. Lazy Load ou a3 Lazy Load en sont des exemples Plugins. De cette façon, l'utilisateur obtient toujours tout le contenu dont il a besoin, mais le temps de chargement de la page peut encore en bénéficier, surtout s'il s'agit d'une page à forte densité d'images.

#8 Nettoyer la base de données

Outre les images et les scripts, votre base de données peut également devenir trop volumineuse. Il existe également des outils pratiques qui vous permettent d'alléger votre base de données. Par exemple, le site Plugin WP-Optimize.

#9 Pingbacks et trackbacks

Par défaut, il interagit WordPress avec d'autres pages qui permettent les pingbacks et les trackbacks. Chaque fois que votre site ou l'un de vos articles de blog est mentionné sur une telle page, votre site en est automatiquement informé, ce qui ajoute une charge supplémentaire à la base de données.

Si vous n'avez pas besoin de cette fonctionnalité (la valeur ajoutée est à mon avis très faible), vous devriez désactiver les pingbacks et les trackbacks. Là encore, le site Plugin WP-Optimize est utile. Par souci d'exhaustivité, il convient toutefois de mentionner à ce stade qu'il s'agit davantage d'un problème théorique. Jusqu'à présent, aucun de nos clients n'a subi de graves pertes de performance.

#N°10 Prévenir les liaisons directes

Le hotlinking signifie que quelqu'un se connecte directement à une image sur votre serveur, ce qui revient à "voler" votre bande passante. Sur un serveur web Apache, vous pouvez empêcher l'établissement de liens dynamiques en ajoutant le code suivant à votre fichier .htaccess :

RewriteEngine on

RewriteCond %{HTTP_REFERER} !^$

RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?deineseite.de [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?google.de [NC]

RewriteCond %{HTTP_REFERER} !^http(s)?://(www.)?google.com [NC]

RewriteRule .(jpg|jpeg|png|gif)$ – [NC,F,L]

Pour empêcher le hotlinking sur un serveur NGINX, ajoutez ces lignes de code à votre fichier de configuration NGINX :

location ~ .(gif|png|jpeg|jpg|svg|webp)$ {
     valid_referers none blocked server_names
	 *.example.com example.* www.example.org/galleries/ ~\.google\.;
     if ($invalid_referer) {
        return 403;
    }
}

Ventilation par code :
location ~ .(gif|png|jpeg|jpg|svg|webp)$ {
spécifie les extensions de fichiers que vous souhaitez protéger des hotlinks, par exemple si vous souhaitez protéger des fichiers pdf, la ligne de code ressemblerait à ceci :
location ~ .(gif|png|jpeg|jpg|svg|webp|pdf)$

{valid_referers none blocked server_names
*.deineseite.dedeineseite.de ~.google. ~.bing. ~.yahoo.;
Ces lignes sont un peu longues, mais elles vous aideront à mieux comprendre ce que vous pouvez faire avec cette règle. Ces lignes vous indiquent en gros quels domaines sont autorisés à établir des liens dynamiques entre vos fichiers de toute façon. Dans cet exemple yourpage.com avec tous les sous-domaines, ainsi que Google, Bing et Yahoo.

if ($invalid_referer) {
return 403;
}
Maintenant, lorsqu'une demande arrive et que la ressource de la demande n'est PAS en haut de votre liste blanche, le serveur renvoie un 403 (Interdit).

Autres méthodes pour éviter les liens chauds

Il existe de nombreux plugins de sécurité Plugins dans le répertoire officiel WordPress que vous pouvez utiliser pour empêcher la création de liens hypertextes - par exemple All In One WP Security & Firewall. Le site Plugin est actif sur plus de 900 000 sites web WordPress et a une note moyenne de 4,8 sur 5 étoiles (avec plus de 1 000 avis). Vous pouvez également empêcher l'établissement de liens à chaud via les en-têtes CORS dans vos paramètres BOX . Si vous avez des questions concernant la configuration de l'en-tête de votre BOX , n'hésitez pas à nous contacter au support technique.

"Et qu'en est-il du CDN ?"

L'une des questions les plus fréquemment posées concerne un réseau de diffusion de contenu (CDN). Par exemple : "Un CDN rend-il mon site plus rapide pour les visiteurs en Allemagne", "Pourquoi ai-je vraiment besoin d'un CDN ?", "Me recommanderiez-vous d'utiliser un CDN pour mon blog ou ma boutique ? Dans la plupart des cas, cependant, la réponse a été : non.

Pour faire court, une longue histoire : Un CDN est le plus logique si vos utilisateurs sont géographiquement dispersés. Par exemple, si vous avez des clients en Europe centrale, en Amérique du Sud et en Australie. Si votre groupe cible principal est limité à un pays, vous pouvez oublier le CDN pour optimiser votre performance WordPress .

Au fait, le développeur de WordPress , Ernesto Ruge, a écrit un très bel article sur ce problème, que je ne peux que vous recommander.

Conclusion : n'ayez pas peur des étapes d'optimisation compliquées

Les utilisateurs ont souvent peur des zones où il est particulièrement facile de gagner du temps de chargement. Ou bien ils négligent ces domaines. D'autres, par contre, comme le CDN, reviennent sans cesse lors des consultations, bien qu'ils n'aient généralement aucun effet sur le temps de chargement des pages.

Par conséquent, je ne peux que vous conseiller de vous concentrer d'abord sur les "fruits à portée de main" de l'optimisation. Car avec relativement peu d'efforts, vous pouvez déjà faire de grands progrès dans la réduction de votre temps de chargement. Et cela même si vous êtes un profane.

Ne vous laissez donc pas décourager par les conseils d'outils comme Google PageSpeed Insights .

Parce qu'au fond, l'optimisation du temps de chargement ne concerne que quelques domaines :

  • Réduire la taille de votre page
  • Réduction des demandes HTTP
  • Compression des différents paquets de données
  • Optimisation de l'expérience de l'utilisateur

Si vous avez compris cela, vous pouvez aussi tourner judicieusement les 10 vis de réglage les plus importantes de la performance WordPress . Et pour les étapes d'optimisation plus complexes, il existe également des experts qui peuvent mettre votre site à niveau.

Articles connexes

Commentaires sur cet article

Laisse un commentaire

Ton adresse électronique ne sera pas publiée. Les champs obligatoires sont marqués d'un *.