Améliorer les performances de Joomla! grâce à un .htaccess

Savez-vous que vous pouvez réduire considérablement la taille et augmenter la vitesse de votre site web simplement en utilisant un fichier .htaccess ? Compression automatique des ressources, ETags et Expires Headers sont souvent des éléments négligés, qui peuvent grandement améliorer les performances de votre site web. Cet article va tenter d’expliquer dans un language « non-geek » ce qu’ils sont, ce qu’ils font, et comment les utiliser sur votre propre site web.

Améliorer les performances de Joomla! grâce à un .htaccess Savez-vous que vous pouvez réduire considérablement la taille et augmenter la vitesse de votre site web Joomla! simplement en utilisant un fichier .htaccess ? Compression automatique des ressources, ETags et Expires Headers sont souvent des éléments négligés, qui peuvent grandement améliorer les performances de votre site web. Cet article va tenter d’expliquer dans un language « non-geek » ce qu’ils sont, ce qu’ils font, et comment les utiliser sur votre propre site web.
Pour illustrer les avantages, j’ai effectué de nombreux tests en utilisant 2 templates (venant de fournisseurs de templates connus et réputés) et le template natif de Joomla!, Atomic, et mesuré les résultats avec un outil très pratique de GTMetrix. Chacune des trois installations à été chargée avec les données d’exemple du fournisseur. Plusieurs tests ont été effectués afin de quantifier les avantages de l’utilisation d’un htaccess afin d’améliorer les performances du site, mais également sa sécurité. Les demos de templates des fournisseurs chargent significativement plus de données d’exemple et d’images que le template natif de Joomla! et comparer Atomic aux templates commerciaux n’est pas « Apples to apples », cependant, les résultats sont toujours intéressants.
1 – Le test d' »AVANT » (BEFORE) est notre test indicatif qui permet de mesurer les performances « out of the box » (avant d’apporter les modifications) et a été effectué avec seulement deux ajustements mineurs pour chacune des démos : en renommant le fichier htaccess.txt, natif de Joomla!, en .htaccess et en activant la ré-écriture d’URL dans la configuration générale du site. Les résultats que vous pouvez voir dans le tableau ci-dessous sont assez pauvres.
2 – Les résultats d' »APRES » (AFTER) montrent une énorme amélioration de la taille des pages, du temps de chargement ainsi que de la vitesse du site. Ce test a été effectué après avoir remplacé le fichier .htaccess natif de Joomla! par un fichier beaucoup plus lourd, aussi bien littéralement que métaphoriquement. Le fichier original pesait 4KB et le .htaccess Master pèse 24KB avec les commentaires. Aucune extension ou plugin n’a été ajouté et la compression gzip ou le cache n’ont pas été activés. Les résultats montrent une amélioration de 46% sur le test Page Speed Grade pour Atomic, 34% pour Voxel et 26% pour Steam.
3 – Le test « W/GZIP » a été effectué après avoir activé la compression native de Joomla! ainsi que le cache, 2 paramètres placés dans la configuration générale du site. Le plugin « Système – Cache » a également été activé. Il n’y a presque aucun changement mesurable et j’ai été assez surpris par ce résultat.
4 – Le dernier test « JCH » est le résultat de l’installation du plugin JCH Optimize qui améliore légèrement les templates venant des fournisseurs, mais qui nous donne un « A » pour Yslow Grad pour le template Atomic. Impressionnant !

Tous les tests ont été effectués sur le même Virtual Private Server à moins d’une minute d’intervalle.

Joomla! 3 Le Livre Pour Tous

Écrit pour toutes les personnes qui débutent avec Joomla!, ou qui possèdent déjà quelques connaissances avec les versions précédentes, et qui souhaitent construire et entretenir un site web sans avoir à entrer dans le code.

version numérique
{j2store}42||cart{/j2store}

version papier
{j2store}18||cart{/j2store}

Comment fait-on ? c’est à partir d’ici que l’article se complique un peu. Vous devez lire TOUS les commentaires et prendre les décisions pour vos besoins spécifiques. Procédez avec prudence au delà de cet endroit, il y a des dragons !
Il existe de nombreux articles traitant de la sécurité des sites par l’utilisation d’un htaccess ainsi que deux extensions aeSecure de Christophe Avonture et Admin Tools d’Akeeba Backup, cependant, nous allons nous consacrer essentiellement sur la performance. Dans le code suivant, vous trouverez de nombreux commentaires expliquant ce que chaque élément peut apporter à votre site. Les fonctionnalités primaires de ce fichier qui vont accélérer votre site sont Etags (Entity Tags), Expires Headers, et automatic compression of ressources.
1 – Etags dit aux caches du navigateur que si une image est l’une de celles qu’il a déjà vues précédemment, il n’a pas besoin de la charger de nouveau.
2 – Expires headers est similaire à Etags mais peu avoir des dates d’expiration différentes par type de fichier. Nous disons au navigateur que le fichier doit être rafraîchi tous les x jours/semaines/mois.
3 – AddOutputFilterByType DEFLATE « minimise » le code source de votre fichier HTML compilé en supprimant les lignes et espaces inutiles. Le template Steam de YooTheme a été réduit de 383 lignes à seulement 5.
########## Begin – ETag Optimization
## This rule will create an ETag for files based only on the modification
## timestamp and their size. This works wonders if you are using rsync’ed
## servers, where the inode number of identical files differs.
## Note: It may cause problems on your server and you may need to remove it
FileETag MTime Size
########## End – ETag Optimization
########## Begin – Automatic compression of resources
# Compress text, html, javascript, css, xml, kudos to Komra.de
# May kill access to your site for old versions of Internet Explorer
# The server needs to be compiled with mod_deflate otherwise it will send HTTP 500 Error.
# mod_deflate is not available on Apache 1.x series. Can only be used with Apache 2.x server.
# AddOutputFilterByType is now deprecated by Apache. Use mod_filter in the future.
AddOutputFilterByType DEFLATE text/plain text/html text/xml text/css application/xml application/xhtml+xml application/rss+xml application/javascript application/x-javascript
########## Begin – Optimal default expiration time
## Note: this might cause problems and you might have to comment it out by
## placing a hash in front of this section’s lines

# Enable expiration control
ExpiresActive On

# Default expiration: 1 hour after request
ExpiresDefault « now plus 1 hour »

# CSS and JS expiration: 1 week after request
ExpiresByType text/css « now plus 1 week »
ExpiresByType application/javascript « now plus 1 week »
ExpiresByType application/x-javascript « now plus 1 week »

# Image files expiration: 1 month after request
ExpiresByType image/bmp « now plus 1 month »
ExpiresByType image/gif « now plus 1 month »
ExpiresByType image/jpeg « now plus 1 month »
ExpiresByType image/jp2 « now plus 1 month »
ExpiresByType image/pipeg « now plus 1 month »
ExpiresByType image/png « now plus 1 month »
ExpiresByType image/svg+xml « now plus 1 month »
ExpiresByType image/tiff « now plus 1 month »
ExpiresByType image/vnd.microsoft.icon « now plus 1 month »
ExpiresByType image/x-icon « now plus 1 month »
ExpiresByType image/ico « now plus 1 month »
ExpiresByType image/icon « now plus 1 month »
ExpiresByType text/ico « now plus 1 month »
ExpiresByType application/ico « now plus 1 month »
ExpiresByType image/vnd.wap.wbmp « now plus 1 month »
ExpiresByType application/vnd.wap.wbxml « now plus 1 month »
ExpiresByType application/smil « now plus 1 month »

# Audio files expiration: 1 month after request
ExpiresByType audio/basic « now plus 1 month »
ExpiresByType audio/mid « now plus 1 month »
ExpiresByType audio/midi « now plus 1 month »
ExpiresByType audio/mpeg « now plus 1 month »
ExpiresByType audio/x-aiff « now plus 1 month »
ExpiresByType audio/x-mpegurl « now plus 1 month »
ExpiresByType audio/x-pn-realaudio « now plus 1 month »
ExpiresByType audio/x-wav « now plus 1 month »

# Movie files expiration: 1 month after request
ExpiresByType application/x-shockwave-flash « now plus 1 month »
ExpiresByType x-world/x-vrml « now plus 1 month »
ExpiresByType video/x-msvideo « now plus 1 month »
ExpiresByType video/mpeg « now plus 1 month »
ExpiresByType video/mp4 « now plus 1 month »
ExpiresByType video/quicktime « now plus 1 month »
ExpiresByType video/x-la-asf « now plus 1 month »
ExpiresByType video/x-ms-asf « now plus 1 month »

########## End – Optimal expiration time

module-boutique-2
Trucs & Astuces
Tous les serveurs ne sont pas construits de la même manière. Les réglages par défaut d’un serveur varient d’un hébergeur à l’autre, et cela signifie que certains paramètres de ce htaccess peuvent produire des erreurs 500 Internal Server Errors. Le meilleur moyen de définir exactement la cause de l’erreur est de supprimer un morceau du code, envoyer, puis tester le site. Si l’erreur persiste, replacez le premier morceau de code, puis supprimez-en un autre, puis répétez l’opération. Il est pratique de noter le numéro des lignes jusqu’à trouver le coupable.
Si vous trouvez que certains fichiers css ou javascript ne sont pas optimisés proprement, utilisez un outil comme Firebug ou l’inspecteur d’élément de Chrome afin d’afficher les erreurs rapportées. Les erreurs 403 Forbidden signifient typiquement que vous avez bloqué l’accès à un type de fichier ou de dossier. Regardez le chemin du fichier dans l’erreur puis créez un RewriteRule pour permettre l’accès à ce dossier comme le montrent les exemples ci-dessous. Cela a été mon experience avec les templates de RocketTheme qui ont besoin d’accéder au dossier « fots ». Les templates YooTheme et/ou Widjetkit et/ou Zoo ont besoin d’accéder à leurs dossiers de cache respectifs.
RewriteRule ^templates\/your_template_folder/ – [L]
## I found this necessary for @fontface fonts
RewriteRule ^templates\/your_template_folder\/fonts/ – [L]
##Yoo Themes Widgetkit and Zoo will not display css styles or images correctly if the cache folder access is blocked
RewriteRule ^cache\/widgetkit/ – [L]
RewriteRule ^cache\/com_zoo/ – [L]
RewriteRule ^cache\/com_templates/ – [L]
RewriteRule ^cache\/template/ – [L]
RewriteRule ^cache\/plg_jch_optimize/ – [L]
Un article fantastique par Jeff Star de Perishable Press qui s’appelle Stupid htaccess Tricks fournit une documentation complète du code et des fonctions.
Disclaimer
Ce n’est en aucun cas un tutoriel complet, et le htaccess n’est pas destiné à être appliqué tel quel à votre site Joomla! en lieu et place du fichier natif sans avoir préalablement modifié le code afin de l’adapter à votre site et à votre serveur. Une bonne connaissance du code de ce htaccess est requise ou vous allez certainement casser (temporairement) votre site. Essayé-le sur un serveur préalablement, et souvenez-vous, toujours, toujours faire une sauvegarde AVANT.
Ressources

Perishable Press
aeSecure
Akeeba Backup
Joomla Documents
JCH Optimize
YSlow
CDN for Joomla
Stupid htaccess Tricks
GTmetrix

 
Credits

Brian Teeman @brianteeman
Ken Crowder (ChiefGoFor)
Radek Suski @radeksu
Fotis Evangelou @fevangelou
Jon Neubauer @219jondn
Nicholas K. Dionysopoulos @akeebabackup
Jon Brown @jsbrwn
Jeff Star @perishable
Cindy Montano @montanodesigns

Note : cet article est une traduction de l’article .htaccess File That FREAKIN Works!

module-boutique-3
Crédits photo
Image by Free-Photos from Pixabay