Optimiser WordPress

Publié par Tpeltier le

Tout le mérite en revient à Vladimir Prelovac et la traduction à Christophe Logiste qui a traduit le texte avec beaucoup de largesse 😉 Il a laissé les liens vers les autres articles en anglais sinon ça deviendrait vite un boulot monstrueux pour tout traduire.

Introduction

Cette Bible de l’optimisation pour WordPress est une collection de tutoriels et d’astuces utiles afin d’améliorer au mieux la rapidité de votre blog WordPress.

Si vous avez déjà expérimenté les ralentissements du panneau d’admin, les  messages « MySQL server has gone away » », les pages lentes à afficher ou si vous voulez préparer votre site à recevoir des tonnes de trafic ( comme une future homepage sur Digg ), ce guide est fait pour vous.

1. Consultez les statistiques du blog

La plupart du temps le problème des sites lent à afficher provient de la taille de la page. Une page typique s’affiche aujourd’hui agrémentée d’images, de flash, de vidéos ou de divers codes Javascript. Chacun de ces éléments consomme de la bande passante.

Pour vous atteler à régler le problème sérieusement vous avez besoin du navigateur Firefox et des extensions Firebug et YSlow.

Le module YSlow vous permettra d’avoir un score de performance variant entre 0 et 100. Un bon objectif serait d’arriver au moins à un score de 80.

Essayez de garder le poids de chaque page sous les 100Ko mais si vous pouvez amener cela sous les 50ko c’est encore mieux. Si vous avez beaucoup de contenu multimédia, apprenez par tous les moyens à utiliser YSlow.

Apprenez comment améliorer la vitesse d’affichage de vos pages

2. Vérifiez votre système d’exploitation Vista

En de rares occasions, lorsque votre site et d’autres mettent un certain temps à charger, votre Vista pourrait être la cause du problème.

Si vous tournez sous Vista lisez cet article pour faire un diagnostic et trouver une éventuelle solution.

3. Vérifiez les plugins

Sur WordPress, les plugins sont généralement les suspects principaux aux lenteurs visibles. Avec le nombre de plugins existants il y a des chances que vous en ayez installé un qui ne soit pas optimisé en terme de consommation.

Par exemple certains plugins étaient connu dans le passé pour causer des lenteurs. C’est le cas du Popularity Contest, de aLinks ou @Feed.

Afin de vérifier si le problème provient de ces derniers, désactivez-les tous et analysez à nouveau les endroits qui posaient problème. Si cela marche mieux, réactivez-les tous un à un jusqu’à ce que vous trouviez le coupable.

Lorsque vous avez identifié clairement le plugin défaillant n’hésitez pas à contacter son créateur afin qu’il règle le bug ou qu’il trouve une alternative.

4. Vérifiez votre thème

Si l’analyse des plugins ne donne rien et que le blog semble toujours lent, le problème vient peut-être directement du thème utilisé. Vous pouvez en tester un autre pour voir si cela va mieux.

Certains thèmes peuvent inclure des portions de codes destinées à être exploitées par certains plugins ( souvent dans le fichier function.php ) donc tout ce qui s’applique au plugin, s’applique aussi au thème.

De plus, certains thèmes peuvent faire un usage excessif du Javascript ou des images (note Christophe : notamment dans tous les thèmes magasine à la mode qui gèrent les galeries images ou les modules à onglets) ce qui rend l’affichage des pages plus lent en raison du grand nombre de données à transférer ou des nombreuses requêtes http utilisées.

WordPress est livré dés le départ avec un thème par défaut qui conviendra très bien pour effectuer le test et voir si votre thème installé est le fautif de vos pauvres performances.

Si vous identifiez votre thème comme le coupable, vous pouvez utiliser l’excellente extension Firebug pour régler le problème. Apprenez comment fonction Firebug, votre nouveau meilleur ami.

Vous pouvez aussi vous servir de ce site pour recevoir des informations très rapidement sur la page à analyser.

5. Optimisez les tables de la base de données

Les tables de vos bases de données devraient être périodiquement optimisées (et réparée si nécessaire) afin d’améliorer les performances générale.

Je vous recommande l’utilisation du plugin WP-DBManager qui propose des options comme la sauvegarde de votre base de données, cruciale pour tous les blogs.

WP-DBManager vous permet de programmer cela et de l’oublier par la suite, il prendra soin automatiquement de votre travail (note Christophe : un très très bon plugin à avoir absolument, vous pouvez programmer des sauvegardes de vos bases chaque jour si vous voulez avec envois de cette dernière directement sur votre adresse mail par exemple).

Une autre option est d’optimiser et réparer manuellement vos tables via votre interface Phpmyadmin ou similaire.

Note Christophe : Je me permet de rajouter un petit paragraphe pour mentionner l’existence du plugin Optimize DB qui permet aussi de réparer et optimiser les tables de votre base de données mais depuis l’admin de votre blog.

6. Désactiver la révision des articles

Depuis la version 2.6, WordPress a introduit un mécanisme de révision des articles. Par exemple, chaque fois que vous utilisez le bouton « Sauver », une version du billet en cours d’écriture est créée dans la base de données. Si vous ne voulez pas de cette option, désactivez-là simplement en ajoutant cette ligne dans votre fichier wp-config.php que vous trouverez dans votre dossier d’installation WordPress :

define(‘WP_POST_REVISIONS’, false);

Si vous possédez un blog dont les révisions sont actives depuis un moment, il y a des chances que votre base de données soit bien remplie. Si vous voulez supprimer également les anciennes versions de vos billets, lancez simplement cette requête (par exemple via le plugin DBManager dont nous avons parlé plus haut) :

DELETE FROM wp_posts WHERE post_type = ‘revision’;

Cela aura pour effet de supprimer toutes les sauvegardes « intermédiaires » de vos billets et de rendre ainsi la base plus légère.

Note : Agissez avec prudence. Si vous n’êtes pas certain de ce que vous faites, pensez à faire une sauvegarde avant toute chose ou mieux, demandez à un professionnel de vous aider.

7. Implémenter le système de cache

Le système de cache est une méthode qui permet de récupérer des données préalablement stockées ( le cache ) plutôt que d’utiliser des ressources plusieurs fois pour la même information. Utiliser un cache est le moyen le plus rapide de récupérer une information et est généralement recommandée dans les installations modernes.

7.1 Le cache WordPress

La manière la plus simple d’installer un cache ( et bien souvent la seule si vous possédez un blog hébergé sur un serveur mutualisé ) est d’utiliser un plugin qui le permet.

Le plugin le plus souvent recommandé est WP Super Cache qui est assez simple à installer et à configurer.

Par contre si vous avez votre propre serveur dédié, vous avez d’autres options.

7.2 Optimisation MySql

MySql peut sauver des résultats de requêtes dans son propre cache. Pour activer cela, éditez votre configuration MySql (habituellement /etc/my.cnf) en ajoutant ces lignes :

query_cache_type = 1
query_cache_limit = 1M
query_cache_size = 16M

Cela va créer un cache pour requêtes de 16MB après que vous ayez redémarré votre serveur.

Pour vérifier que cela tourne proprement, lancez la requête :

SHOW STATUS LIKE ‘Qcache%’;

Exemple de résultats :

Qcache_free_blocks 718
Qcache_free_memory 13004008
Qcache_hits 780759
Qcache_inserts 56292
Qcache_lowmem_prunes 0
Qcache_not_cached 3711
Qcache_queries_in_cache 1715
Qcache_total_blocks 4344

Astuce 1 : Si vous vous attendez à recevoir une homepage sur Digg, vous pouvez toujours augmenter la limite moyenne du nombre de connexions MySql simultanées qui est souvent la première raison pour laquelle un site « tombe » lors de l’afflux de trafic.

Vous pouvez vous préparer en montant la limite à 200 simplement en ajoutant cette ligne dans le fichier de configuration :

max_connections = 200

Voici une lecture de plus concernant l’optimisation MySql et encore une ici. Vous pouvez aussi installer Mytop qui fonctionne avec MySql. Extrêmement utile, l’outil Mysqlreport vous aidera à comprendre votre base MySql comme jamais.

7.3 Le cache PHP

PHP est un langage interprété, ce qui signifie que chaque fois que le code PHP est lancé, il est compilé dans ce qu’on appelle des opcodes qui sont lancé par la suite par le système. Ce processus de compilation peut être mit en cache en installant un outil comme eAccelerator. Mais il existe d’autres solutions de cache.

Pour installer eAccelerator, décompressez l’archive et allez sur le répertoire eAccelerator. Ensuite tapez :

phpize
./configure
make
make install

Cela aura pour effet d’installer eAccelerator. Ensuite créez un dossier temporaire de stockage

mkdir /var/cache/eaccelerator
chmod 0777 /var/cache/eaccelerator

Finalement, pour l’activer, ajoutez ces lignes à votre fichier php.ini ( qui se trouve généralement dans /etc/php.ini ou /usr/lib/php.ini ) :

extension= »eaccelerator.so »
eaccelerator.shm_size= »16″
eaccelerator.cache_dir= »/var/cache/eaccelerator »
eaccelerator.enable= »1″
eaccelerator.optimizer= »1″
eaccelerator.check_mtime= »1″
eaccelerator.debug= »0″
eaccelerator.filter= » »
eaccelerator.shm_max= »0″
eaccelerator.shm_ttl= »0″
eaccelerator.shm_prune_period= »0″
eaccelerator.shm_only= »0″
eaccelerator.compress= »1″
eaccelerator.compress_level= »9″

Les changements seront perceptibles tout de suite, le PHP n’ayant pas besoin d’être « redémarré ».

Note 1 : WP Super Cache et eAccelerator fonctionnent très bien ensemble augmentant ainsi encore les performances.

Note 2 : Si vous aimez les performances et voulez aller encore plus loin, jetez un oeil sur le super plugin WP Super cache et eAccelerator.

Note 3 : Vous pouvez facilement effectuer des tests sur votre configuration en lançant divers essais depuis votre invite de commande afin de comparer les résultats. Cela via la commande :

ab -t30 -c5 http://www.monsite.com/

Une bonne moyenne serai de 200 requêtes/seconde sur votre VPS

Note 4 : L’optimisation d’Apache n’est pas abordée ici mais vous pourrez trouver des informations ici. Ainsi qu’une compilation d’astuces sur cette page, des astuces VPS ici et encore d’autres par là.

Note 5 : Vous pouvez trouver d’autres astuces et conseils sur le site d’Elliot Back (et il joue avec DOTA aussi, c’est pas beau ça ?)

Note 6 : Malheureusement eAccelerator ne fonctionnera pas si votre PHP tourne en mode CGI. Vous pouvez essayer d’utiliser fastcgi qui, lui, fonctionne avec suExec et eAccelerator.

Note 7 : D’autres ressources intéressantes : optimisez le temps de chargement des pages et une grande série sur les performances des sites.

8. Solutionnez le fameux « MySql server has gone away »

Cette erreur de la base WordPress apparait sur certaines configurations et se manifeste par une grande lenteur, voire pas de réponses du tout, généralement dans votre interface d’administration.

La solution à ce problème a été abordée dans cet article.

Évidement ce problème existe bien mais la solution suggérée ne fonctionnera que si vous mettez à jour votre WordPress. Espérons que le soucis soit prit en considération et qu’il soit ajouté directement au coeur de wordpress dans les prochaines versions.

9. Fixer le problème d’impossibilité de poster

Si vous avez déjà eu à faire à soucis depuis votre panneau d ‘administration WordPress comme l’impossibilité de poster un billet ou d’en mettre un à jour, vous êtes surement sous le coup d’un bug venant du mod_security

ModSecurity est un module Apache permettant d’accroitre la sécurité du site en empêchant les intrusions systèmes. Cependant, il arrive parfois qu’il décide que votre requête MySql, parfaitement normale, tente d’effectuer une action suspicieuse et la blackliste, ce qui se manifeste par une lenteur excessive ou un manque de réponse du site.

Pour tester si c’est le cas, vérifiez votre log d’erreur Apache, par exemple :

tail -f /usr/local/apache/logs/error_log

Et regardez après quelque chose ressemblant à ceci :

ModSecurity: Access denied with code 500 (phase 2) … [id « 300013 »] [rev « 1 »] [msg « Generic SQL injection protection »] [severity « CRITICAL »] [hostname  www.prelovac.com »] [uri « /vladimir/wp-admin/page.php »

Cela vous dit que l’accès à la page est refusé par une règle de sécurité portant l’ID 300013. Régler le problème passera par le fait de rendre ce processus « clean » pour cette page.

Pour faire cela, éditez le fichier de configuration Apache (for example /usr/local/apache/conf/modsec2/exclude.conf) et ajoutez ces lignes :

<LocationMatch « /vladimir/wp-admin/page.php »>
SecRuleRemoveById 300013
</LocationMatch>

Cela va « white-lister » la page pour la règle de sécurité donnée et votre site continuera à fonctionner normalement.

10. Ping RSS et Pingbacks

Les raisons d’une lenteur excessive lors de la publication d’un article sur WordPress peuvent inclure des délais de dépassements lors du ping RSS et/ou des pingbacks.

Par défaut, WordPress va tenter de pinguer (prévenir) les serveurs présents dans votre liste ( liste que vous pouvez trouver dans Réglages >> Ecriture sur votre administration) et l’un d’entre eux pourrait ralentir l’ensemble du processus.

La seconde raison sont les pingbacks sur vos articles, mécanisme dans lequel WordPress notifie les sites que vous liez dans vos articles. Vous pouvez désactiver les pingbacks via Réglages >> Discussion en décochant simplement l’option : Tenter de notifier les weblogs liés à cet article (ralentit la mise en ligne)

Essayez de supprimer la liste des services de pings et désactivez les pingbacks afin de voir si le problème de lenteur se règle ou pas

Voici les règles générales afin d’optimiser le temps de chargement des pages

11. Utilisez des sous-domaines afin de partager la charge

La plupart des navigateurs sont conçu pour charger de 2 à 4 fichiers d’un même domaine en parallèle. Si vous déplacez certains fichiers vers un autre domaine (cela fonctionne aussi avec un sous-domaine) le navigateur va démarrer le chargement de 2 à 4 autres fichiers simultanément.

C’est une bonne idée de déplacer les fichiers images de votre thème vers un sous-domaine que vous aurez créé pour l’occasion. J’ai créé demo.prelovac.com/images et déplacé les images de mon thème dedans. J’ai ensuite modifié le fichier style.css du thème pour remplacer les liens images par des liens complet de la nouvelle architecture. Job done !

12. Diminuer le nombre de requêtes HTTP

Vous pouvez diminuer le nombre de requêtes en utilisant moins d’images (ou en plaçant plusieurs d’entre elles sur une plus grande que vous positionnez via CSS), moins de Javascript, moins de fichiers CSS (habituellement cela veux dire moins de plugins).

De gros efforts peuvent être fait grâce au PHP speedy plugin qui va fusionner tous vos fichiers javascript et css dans un plus gros, ce qui aura pour effet de diminuer le nombre de requêtes HTTP. Le plus gros problème de PHP Speedy est qu’il n’est pas compatible avec tous les autres plugins.

Utilisez aussi la technique des Sprite pour CSS afin de combiner plusieurs images au sein d’une seule et par la suite utiliser le positionnement via CSS pour les afficher. Cela diminuera aussi de manière significative le nombre de requêtes HTTP.

13. Compressez le contenu en utilisant le .htaccess d’Apache

Si vous avez votre propre serveur, vous pouvez choisir de compresser (via gzip) tout le contenu envoyé aux navigateurs. Cela va diminuer le temps de chargement et la plupart des page html se compressent assez bien.

Ajoutez ce code à votre .htaccess

AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css application/javascript application/x-javascript application/x-httpd-php application/rss+xml application/atom_xml text/javascript

14. Créez des limitations de temps

Créer une en-tête ayant une date d’expiration mentionne au navigateur pendant combien de temps il doit garder le contenu en cache. La plupart des images de votre site ne changent jamais, c’est donc une bonne idée que de les garder en cache localement.

Voici une configuration recommandée :

Header unset Pragma
FileETag None
Header unset ETag
# 1 YEAR
Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
Header unset Last-Modified
# 2 HOURS
Header set Cache-Control "max-age=7200, must-revalidate"
# CACHED FOREVER
# MOD_REWRITE TO RENAME EVERY CHANGE
Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
Header unset Last-Modified

Utilisez le moteur de cache pour vérifier votre configuration.

15. Cache Gravatar

De nombreux blogs utilisent le service gravatar (surtout sous wordpress), ces petites images servant à donner un peu de vie au sein des commentaires. Toutefois gravatar a 2 grands défauts si l’on regarde le côté optimisation du blog.

– chaque nouveau gravatar est une requête HTTP supplémentaire même s’il s’agit d’afficher la même image (une page avec 100 commentaires aura donc 100 requêtes de plus)
– les images gravatar ne contiennent pas d’expiration pour le cache.

Ce qu’il est possible de faire c’est de créer un cache local pour gravatar, dans lequel les images gravatar seraient livrées depuis le serveur de notre site. Idéalement vous placerez le cache gravatar dans un sous-domaine (voir le point 11).

J’utilise un plugin de Zenpax.com qui permet de faire ce travail.

16. Optimiser ses images grâce à smush.it

Le fait de pouvoir optimiser les images elles-même est souvent négligé, pourtant cela peut réduire les temps de chargement de manière conséquente.

Ne serait-ce pas parfait si vous pouviez ouvrir un site, presser un bouton de votre navigateur et voir toutes les images optimisées et disponible dans un simple fichier compressé à récupérer ? C’est possible grâce à l’extension smush.it pour Firefox. C’est incroyable de voir l’efficacité de cette solution !

17. Les CSS en haut, les Javascript en bas

C’est une règle d’or que de placer les fichiers CSS en haut de page afin qu’ils soient appelés en premier lieu. Par contre les fichiers Javascript devraient être placé en bas de page lorsque c’est possible. J’ai créé un plugin simple qui permet de déplacer correctement les fichiers Javascript en bas de page. Le plugin se nomme Footer Javascript.

Conclusion

Les serveurs et sites actuels ont grossit et dépendent maintenant de nombreux facteurs.

Cet article couvre une approche variée de l’optimisation en partant du niveau Apache, PHP et MySql tout en passant par les modifications de votre WordPress.

J’espère que suivre ce guide vous aidera à créer un site WordPress plus rapide et plus réactif.

Conclusion

Voilà j’ai tenté au mieux de vous présenter ce guide en sachant que je ne suis pas parfait bilingue et que je suis limité en connaissances techniques. J’espère ne pas trop avoir déformé le superbe travail de Vladimir et qu’il serait d’une aide appréciable aux francophones désireux d’optimiser leur blog wordpress 😉

Allez au boulot maintenant ! Optimisez, optimisez !

Catégories : wordpress

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée.

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.