Lorsque vous jouez à « game of trônes » avec votre site, soit vous gagnez, soit vous améliorez légèrement son rendement. Pourquoi prendre des risque lorsque vous pourriez optimiser votre site avec le meilleur plugin de mise en cache ?
C’est la raison pour laquelle nous allons déterminer le meilleur plugin de mise en cache WordPress dans ce billet.
Joignez-vous à nous pour comparer et passer en revue les plugins de mise en cache les plus appréciés pour WordPress :
Hummingbird vs WP Rocket vs WP Super Cache
afin de découvrir lequel a tiré son épingle du jeu.
Établissons des règle base : Google PageSpeed Insights
Il n’y a pas que les scores qui comptent. Ils ne déterminent pas l’efficacité dans le monde réel, mais peuvent vous donner un aperçu solide de ce que vous devez améliorer.
Il en est de même pour Google PageSpeed Insights. Lorsque vous effectuez un test, vous obtenez un aperçu de ce que le puissant moteur de recherche juge important. Si vous pouvez fournir ces prestations et apporter les améliorations adéquates, telles que l’utilisation du lazy loading et des formats nouvelle génération, vous pourriez améliorer considérablement votre « expérience utilisateur » et le SEO de votre site en même temps.
Google utilise le logiciel libre Lighthouse pour évaluer la qualité des pages Web en fonction de leur performance en situation réelle. Il ne s’agit pas uniquement de théorie, mais de réelles mises en application, comme dans la façon dont votre site fonctionne sur un appareil de niveau intermédiaire avec un réseau mobile de mauvaise qualité. Vous pouvez ainsi voir à quel point ce test est très utile.
Dans Google PageSpeed Insights, le score est découpé en trois niveaux :
- lent (tout ce qui est en dessous de 50),
- moyen (entre 50 et 90),
- rapide (tout ce qui dépasse 90), et c’est le niveau que nous souhaitons atteindre.
Mais le score global n’est pas la seule mesure qui importe. Les mesures suivantes offrent un tableau plus précis de l’expérience des visiteurs sur votre site :
- First Contentful Paint: First Contentful Paint mesure le temps d’affichage du premier texte ou de la première image.
- Speed Index: Speed Index montre à quelle vitesse les contenus de la page sont rendus visibles.
- Time to Interactive: Time to interactive mesure le temps qu’il faut à une page pour devenir pleinement interactive.
- First Meaningful Paint: First Meaningful Paint mesure le moment où le contenu principal d’une page s’affiche.
- First CPU Idle: First CPU Idle indique le délai à partir duquel le fil d’exécution principale est suffisamment disponible pour gérer les entrées.
- Estimated Input Latency : Estimated Input Latency est une estimation du délai nécessaire à votre application pour répondre à une entrée de l’utilisateur.
Comment nous effectuons le test ?
Nous allons faire deux séries de tests sur chaque plugin :
- Tout d’abord, nous allons tester les paramètres par défaut pour les trois plugins. Si les paramètres sont déjà activés ou configurés, nous les laisserons ainsi. En gros, nous allons installer le plugin, lui donner une minute pour faire son travail, rafraîchir la page d’accueil une ou deux fois, puis lancer un test Google PageSpeed Insights.
- Ensuite, nous allons activer tous les paramètres recommandés et refaire le test pour voir la différence. L’objectif est de tirer le maximum de vitesse de WordPress.
Afin d’obtenir des résultats stables, nous allons effectuer le test 3 fois et faire la moyenne des scores.
Commencer par une base de référence
Theme WordPress
La première chose que nous devons faire est d’établir une base de référence et de découvrir comment notre site test fonctionne sans aucun plugin d’optimisation.
Nos premiers tests ont donné les résultats suivants :
| Mesure | Smartphone | Ordi de Bureau |
| Score de vitesse | 36 | 58 |
| First Contentful Paint | 5,5 s | 1,8 s |
| Speed Index | 10,8 s | 3,8 s |
| Time to Interactive | 6,4 s | 1,9 s |
| First Meaningful Paint | 5,6 s | 1,9 s |
| First CPU Idle | 5,6 s | 1,9 s |
| Estimated Input Latency | 10 ms | 10 ms |
Ce n’est pas le pire score, mais la marge de progrès est encore importante, surtout sur un appareil mobile.
Mais assez de détails, passons à la partie intéressante.
Comparaison des plugins de mise en cache WordPress
Concurrent N°1 : WP Super Cache
Nous avons ici préféré des internautes avec plus de 2 millions de téléchargements : WP Super Cache.
WP Super Cache n’est pas une solution d’optimisation tout-en-un. Il s’agit plutôt d’une solution qui consiste à bien faire une seule chose, et c’est la mise en cache.
Mise en cache
Pour les novices, WordPress utilise PHP pour générer les fichiers de votre site à la demande d’un visiteur. C’est un long processus, car il faut du temps pour récupérer toutes les informations nécessaires de la base de données et les assembler sur votre page Web. C’est comme inviter quelqu’un à dîner et attendre que la personne soit à votre porte pour aller faire les courses ou commencer à cuisiner.
La mise en cache, par contre, est ce qui se passe lorsqu’un deuxième invité se présente une fois que le repas est prêt. Cette personne n’a pas besoin d’attendre que vous alliez à l’épicerie et que vous cuisiniez, parce que la partie qui prend du temps a déjà été faite. Vous n’avez qu’à dresser le couvert et voilà ! Votre page dîner est servie.
Dans WordPress, les plugins de mise en cache offrent une version statique de votre page qui a déjà été prétraitée afin de servir la page plus rapidement.
Examen des plugins de mise en cache WordPress
Comment WP Super Cache s’en est-il sorti ?
D’abord, il n’y avait pas vraiment une grande différence entre les deux tests. Le plugin a fonctionné à peu près de la même façon lorsque nous avons comparé la configuration par défaut à la configuration avec tous les paramètres recommandés activés. C’est une bonne chose pour les débutants, car il n’y a pas grand-chose à faire pour obtenir les meilleurs résultats.
Voici les résultats que nous avons obtenus :
| Mesure | Mobile | Bureau |
| Score de vitesse | 40 | 64 |
| First Contentful Paint | 5,5 s | 1,8 s |
| Speed Index | 8,3 s | 2,7 s |
| Time to Interactive | 6,4 s | 1,8 s |
| First Meaningful Paint | 5,6 s | 1,8 s |
| First CPU Idle | 5,6 s | 1,8 s |
| Estimated Input Latency | 10 ms | 10 ms |
Donc environ 6 points de plus pour un appareil mobile et un ordinateur de bureau. Si vous recherchez une simple solution de mise en cache, WP Super Cache vous aidera, mais si vous voulez vraiment optimiser votre site, il vous faudra beaucoup plus.
Place au concurrent N°2…
Concurrent N°2 : WP Rocket
Nous entrons dans le vif du sujet. WP Rocket est un plugin d’optimisation complet. Il y a donc beaucoup plus qu’une simple mise en cache.
Après avoir exécuté Google PageSpeed Insights trois fois, voici nos résultats :
| Mesure | Mobile | Bureau |
| Score de vitesse | 35 | 58 |
| First Contentful Paint | 5,6 s | 1,8 s |
| Speed Index | 11,6 s | 4,0 s |
| Time to Interactive | 6,4 s | 1,9 s |
| First Meaningful Paint | 5,7 s | 1,9 s |
| First CPU Idle | 5,7 s | 1,9 s |
| Estimated Input Latency | 10 ms | 10 ms |
Ce n’est pas surprenant. Lorsque vous avez un plugin avec autant d’options, beaucoup d’entre elles ne sont pas activées par défaut. C’est une bonne chose parce que vous pouvez ajuster les paramètres en fonction de votre site.
Une chose que nous avons trouvée étrange lors de l’exécution du test, c’est que la version mobile du rapport PageSpeed Insights montrait un score inférieur de 1 point sans aucun plugin, indépendamment de l’option Activer la mise en cache pour les appareils mobiles. Peut-être que la version n’était pas mise en cache ? Ou que nous devions consulter la page via un appareil mobile avant de faire le test ? Étrange…
Quoi qu’il en soit, après avoir activé tous les paramètres relatifs à l’optimisation dans WP Rocket, nous avons reçu diverses notifications nous indiquant l’état de préchargement du cache, la génération des ressources, etc. C’est une bonne chose. Nous avons attendu que tout cela soit terminé avant d’exécuter un autre test PageSpeed.
Nous avons également veillé à ce que les versions mobile et bureau soient mises en cache.
Après avoir lancé 3 tests Google PageSpeed Insights supplémentaires, nous avons obtenu de bien meilleurs résultats :
| Mesure | Mobile | Bureau |
| Score de vitesse | 92 | 98 |
| First Contentful Paint | 2,4 s | 0,6 s |
| Speed Index | 3,7 s | 1,1 s |
| Time to Interactive | 3,0 s | 0,7 s |
| First Meaningful Paint | 2,5 s | 0,6 s |
| First CPU Idle | 2,5 s | 0,6 s |
| Estimated Input Latency | 10 ms | 10 ms |
Toutefois, nous devons mentionner que l’un des tests de bureau a donné un score de 99.
C’est difficile de passer le dernier. Hummingbird pourra-t-il faire mieux ?
Concurrent N°3 : Hummingbird
Hummingbird est aussi un plugin compact avec une multitude d’options puissantes pour améliorer la performance de votre site. Essayez-le par vous-même et faites votre propre test.
Nous nous attendions à ce que Hummingbird fonctionne de la même manière, simplement parce que de nombreuses options ne sont pas activées par défaut.
Nos hypothèses étaient justes. Voici les résultats obtenus avec les paramètres par défaut :
| Mesure | Mobile | Bureau |
| Score de vitesse | 36 | 58 |
| First Contentful Paint | 5,5 s | 1,8 s |
| Speed Index | 10,9 s | 3,8 s |
| Time to Interactive | 6,4 s | 1,9 s |
| First Meaningful Paint | 5,6 s | 1,9 s |
| First CPU Idle | 5,6 s | 1,9 s |
| Estimated Input Latency | 10 ms | 10 ms |
Vous l’avez sans doute remarqué, ces résultats sont semblables à ceux de notre base de référence.
Passons maintenant à la partie amusante. Hummingbird a beaucoup de modules d’optimisation, donc nous les avons tous activés.
Il a fallu un certain temps pour que le module d’optimisation Hummingbird termine l’analyse des 178 ressources, donc si vous voulez faire le même test, soyez patient. Nous avons ensuite combiné, réduit et déplacé toutes les ressources dans le pied de page.
Nous avons laissé jQuery et jQuery migrer dans leurs emplacements d’origine, ce qui est similaire à l’option de compatibilité dans WP Rocket.
Après nous être assurés que les appareils mobiles et les ordinateurs de bureau avaient une version en cache comme nous l’avons fait avec WP Rocket, nous avons lancé Google PageSpeed Insights et BAM !
Résultats PageSpeed pour Hummingbird
| Mesure | Mobile | Bureau |
| Score de vitesse | 96 | 100 |
| First Contentful Paint | 1,7 s | 0,5 s |
| Speed Index | 2,2 s | 0,7 s |
| Time to Interactive | 3,4 s | 0,9 s |
| First Meaningful Paint | 1,7 s | 0,5 s |
| First CPU Idle | 3,4 s | 0,9 s |
| Estimated Input Latency | 10 ms | 10 ms |
Non seulement Hummingbird a battu WP Rocket sur le score de vitesse pour appareil mobile et ordinateur de bureau, mais il a également battu WP Rocket en ce qui concerne First Contentful Paint, Speed Index et First Meaningful Paint. Hummingbird livre le contenu plus rapidement que WP Rocket, bien que WP Rocket permette une interaction plus rapide.
Résultats PageSpeed pour WP Rocket (pour comparaison)
| Mesure | Mobile | Bureau |
| Score de vitesse | 92 | 98 |
| First Contentful Paint | 2,4 s | 0,6 s |
| Speed Index | 3,7 s | 1,1 s |
| Time to Interactive | 3,0 s | 0,7 s |
| First Meaningful Paint | 2,5 s | 0,6 s |
| First CPU Idle | 2,5 s | 0,6 s |
| Estimated Input Latency | 10 ms | 10 ms |
Hummingbird : 100 sur l’ordinateur de bureau
Nous pensons que le module d’optimisation de ressources de Hummingbird lui a donné un avantage, car il permet une configuration très détaillée. Il y a aussi une option En ligne/Reporter dans Hummingbird que nous n’avons pas activée parce que nous n’en avions pas besoin. Après avoir atteint 100 sur l’ordinateur de bureau, cela semblait être inutile.
Nous devons également mentionner que si la mise à niveau vers Hummingbird Pro vous donne accès à toutes les fonctionnalités de Hummingbird, telles que Hummingbird CDN, vous pouvez accomplir tout le reste avec la version gratuite de Hummingbird.
Autres conseils d’optimisation
Si votre site a besoin d’une aide supplémentaire pour l’optimisation, nous vous suggérons de commencer par les images, car elles sont généralement l’un des pires contrevenants quand il s’agit de ralentir votre site.
C’est particulièrement vrai lorsque les images ne sont pas utilisées correctement ou sont surdimensionnées. Jetez un coup d’œil à notre article sur comment utiliser des images Retina qui ne ralentissent pas WordPress.
Le Lazy loading de vos images améliorera également la performance de votre site.
Enfin, nous vous suggérons de vous inscrire pour un essai gratuit de 30 jours afin que vous puissiez essayer Hummingbird sur votre site. Et pendant que vous y êtes, donnez également une chance à Smush Pro puisqu’il comprend une adhésion à WPMU DEV. Smush Pro possède d’impressionnantes fonctions d’optimisation d’image. Lorsque vous combinez Hummingbird et Smush, votre site se chargera si vite qu’il va vous époustoufler.
D’après un article source de WPMUDEV : https://premium.wpmudev.org/blog/top-wordpress-caching-plugins/
Merci beaucoup pour cet excellent article. J’utilisais WP Rocket jusqu’à présent mais je vais tester Hummingbird en version gratuite pour voir si je constate une différence. Est-il aussi facile à configurer pour un non-développeur de métier ?