Optimisation de site WordPress

Nul besoin d’étaler des courbes, graphiques et camemberts dans le but d’argumenter sur le temps de chargement; le pourcentage de visiteurs quittant le site après X seconde ,le nombre de pages vues et biensur le taux de conversion ( pour les intéressés, http://www.seomoz.org/blog/site-speed-are-you-fast-does-it-matter ) . C’est plutôt une question de bon sens d’avoir un site Web réactif, et encore plus aujourd’hui avec les visites sur mobile.

http://www.motortrend.com/roadtests/coupes/1302_2013_mercedes_benz_sls_amg_gt_first_test/photo_18.html

Les techniques d’optimisation Web sont pour être efficace à réaliser dès le début de son projet :

• Utilisation minime du javascript ou de scripts allégés, déférer leur chargement.
• Utilisation de sprite CSS pour limiter le nombre d’images.
• Alléger ses images et les avoir à la bonne taille.

Mais si on ne s’est pas du tout préparer à cela, il existe tout de même des solutions, je prendrai ici l’exemple de PageSpeed et du plugin W3 Total Cache qui permettront d’accroitre considérablement le temps de chargement de votre site et sa fluidité lors de la visite de l’internaute.

Optimisation WordPress avec PageSpeed

Le module PageSpeed de Google pour Apache permet d’appliquer automatiquement des optimisations comme la minification CSS et Javascript, la création de sprite ou l’utilisation de l’encodage 64bits pour les images.

Commençons tout d’abord par l’installer :

wget https://dl-ssl.google.com/dl/linux/direct/mod-pagespeed-beta_current_amd64.deb
dpkg -i mod-pagespeed-*.deb
rm -rf mod-pagespeed-*.deb

puis l’activer :

a2enmod pagespeed
/etc/init.d/apache2 reload

Pour consulter les outils activés par défaut dans le core : https://developers.google.com/speed/docs/mod_pagespeed/config_filters

Le module Pagespeed est maintenant activé sur tout les sites présent sur le serveur. Si vous souhaitez ne l’activer que sur un site en particulier, il faut désactiver ModPagespeed dans les mods-enabled d’apache ( généralement placé sous /etc/apache2/mods-enabled/pagespeed.conf ), placer « ModPagespeed off ».

Il suffit d’ouvrir ensuite le .htaccess à la racine du site, pour l’activer et le désactiver sans avoir à redémarrer Apache ( pratique pour faire des tests ).

Voici le .htaccess avec tous les modules activés :

Modpagespeed on

ModPagespeedEnableFilters combine_css
ModPagespeedEnableFilters extend_cache
ModPagespeedEnableFilters rewrite_images
ModPagespeedEnableFilters rewrite_css
ModPagespeedEnableFilters rewrite_javascript
ModPagespeedEnableFilters outline_css
ModPagespeedEnableFilters outline_javascript
ModPagespeedEnableFilters move_css_above_scripts
ModPagespeedEnableFilters move_css_to_head
ModPagespeedEnableFilters flatten_css_imports
ModPagespeedEnableFilters make_google_analytics_async
ModPagespeedEnableFilters combine_javascript
ModPagespeedEnableFilters resize_mobile_images
ModPagespeedEnableFilters inline_preview_images
ModPagespeedEnableFilters remove_comments
ModPagespeedEnableFilters collapse_whitespace
ModPagespeedEnableFilters extend_cache_css
ModPagespeedEnableFilters extend_cache_images
ModPagespeedEnableFilters extend_cache_scripts
ModPagespeedEnableFilters sprite_images
ModPagespeedEnableFilters defer_javascript
ModPagespeedEnableFilters lazyload_images
ModPagespeedEnableFilters insert_dns_prefetch

Vous avez maintenant le module Pagespeed d’apache installé avec tous ses outils d’optimisation. Pour plus de détails sur ces outils : https://developers.google.com/speed/docs/mod_pagespeed/config_filters

Optimisation WordPress avec W3 Total Cache

Maintenant que PageSpeed est installé, il reste encore quelques améliorations à faire, notamment au niveau des Expires Headers, le plugin W3 Total Cache fait parfaitement l’affaire. Il va ajouter dans le htaccess tout ce que nous avons besoin pour optimiser cela. L’installation est la encore super simplifié, il suffit d’activer le plugin, mettre les bonnes permissions sur les fichiers. Si vous êtes sur un serveur, ajouter  » define(‘FS_METHOD’,'direct’);  » au wp-config.php .

Je conseille de désactiver le PageCache, qui est déjà pris en charge par PageSpeed.

Résultats de l’optimisation

Après toutes les modifications, il nous reste plus qu’a tester le site Web avec des outils spécialement dédié à savoir GTmetrix qui combine le Yslow et PageSpeed , et PingDom Tools pour le temps de chargement, le poids de la page..

   

Etape cruciale dans la création d’un site internet, voila notre moteur bien rodé pour subir des pics de milliers d’internautes sans surchauffe. A prévoir tout de même si le serveur n’a pas une mémoire vive énorme :

echo "# mod_pagespeed memory usage limitation
MaxKeepAliveRequests 50
MaxClients          100
MaxRequestsPerChild 500" \
    > '/etc/apache2/conf.d/pagespeed-optimization'

Mercedes-Benz-E-63-AMG
http://automover.blogspot.fr

Optimisation plugins WordPress

Pour analyser les statistiques de chargement des plugins WordPress, le plugin P3 (Plugin Performance Profiler) est idéal, il affiche le temps de chargement de chaque plugin et permet de détecter si certains sont trop lent.

Rédigé par Garry Ysenbaert