Avez-vous déjà remarqué que les articles les plus populaires de votre blog – ceux qui déclenchent une avalanche de commentaires – prennent un peu plus de temps à charger ? Bien qu’il soit agréable de voir les commentaires WordPress arriver, si votre système de commentaires n’est pas soigneusement configuré cela peut vraiment ralentir votre site Web.
Pensez aux ressources qui permettent de faire fonctionner les commentaires :
- Une base de données est interrogée pour extraire les commentaires existants
- Des entrées de base de données sont créées pour chaque nouveau commentaire
- Les commentaires et les métadonnées de commentaires sont reçus et traités par le navigateur d’un visiteur
- Les ressources externes, telles que les Gravatars, sont demandées, téléchargées et chargées
- Dans de nombreux cas, de grandes ressources JavaScript et jQuery doivent être téléchargées et traitées pour que le système de commentaires fonctionne comme il se doit.
Par conséquent, une section de commentaires occupée peut ajouter une charge importante au serveur Web, augmenter la taille globale de la page, augmenter le nombre de requêtes HTTP requises et ajouter des ressources JavaScript supplémentaires auxquelles les navigateurs peuvent être confrontés. Que vous utilisiez des commentaires WordPress natifs ou que vous ayez branché un système de commentaires tiers tel que Disqus ou Facebook Comments, les commentaires peuvent ralentir la vitesse de votre site Web, et vous devriez en faire une priorité pour optimiser la performance de la section commentaires de votre site. D’ailleurs, si vous avez des problèmes avec le spam de commentaires, assurez-vous de lire notre guide détaillé sur le sujet Comment arrêter le spam de commentaire WordPress.
- Stratégies de correction des commentaires à chargement lent
- Optimisation des commentaires WordPress natifs
- Utiliser un système de commentaires tiers
- Commentaires en Lazy load
Stratégies de correction des commentaires à chargement lent
Si vous trouvez que la section commentaires ralentit la vitesse de chargement de vos articles de blog les plus populaires, il y a quelques choses que vous pouvez faire :
- Désactiver complètement les commentaires. Cela réglera certainement le problème. Cependant, vous ne devriez vraiment l’envisager que si votre section commentaires n’ajoute aucune valeur. Si votre section de commentaires est assez occupée pour ralentir votre site, cela rajoute certainement assez de valeur pour que vous ne la laissiez dans cet état. Consultez ou complétez ce tutoriel en apprenant la façon de désactiver les commentaires dans WordPress.
- Optimisez les commentaires WordPress natifs. Si vous utilisez le système de commentaires WordPress natif, il y a certaines choses que vous pouvez faire pour l’accélérer.
- Utiliser un système de commentaires tiers. Si votre site est hébergé sur un serveur mutualisé bon marché et à court de ressources, l’utilisation d’un système de commentaires tiers peut accélérer les pages contenant beaucoup de commentaires. Cependant, si vous êtes hébergé chez Kinsta ou un autre hébergeur de qualité, passer à un hébergeur tiers ne vous aidera pas beaucoup à augmenter la vitesse de chargement de votre site Web et pourrait même le ralentir.
- Commentaires en Lazy load. Que vous utilisiez des commentaires natifs WordPress ou un système de commentaires tiers comme Disqus, trouvez un moyen de charger les commentaires en Lazy load pour qu’ils ne ralentissent pas le rendu de la page initiale.
Examinons chaque stratégie indépendamment afin que vous puissiez déterminer quelle est la meilleure pour votre site.
Optimisation des commentaires WordPress natifs
Il y a deux choses que vous pouvez faire pour accélérer les pages Web qui ont été chargées avec une montagne de commentaires WordPress natifs : limiter le nombre de commentaires qui se chargent initialement et utiliser des avatars hébergés localement. Examinons chaque option à tour de rôle.
Limiter le nombre de commentaires affichés
Par défaut, WordPress est configuré pour charger tous vos commentaires avec la page initiale. Cependant, charger des dizaines, voire des centaines de commentaires, chacun incluant un avatar unique, peut vraiment gonfler votre page et créer de nombreuses requêtes HTTP supplémentaires.
Vous pouvez réduire le nombre de commentaires chargés au chargement initial de la page très facilement.
- Allez dans Paramètres > Discussion dans la zone d’administration de WordPress.
- Recherchez la section Autres paramètres de commentaire.
- Cochez la case à côté de Diviser les commentaires en pages avec et ajoutez une valeur pour le nombre de commentaires que vous voulez afficher au chargement initial de la page.
- Faites défiler jusqu’au bas de la page et cliquez sur le bouton pour enregistrer les modifications.
Après avoir suivi ces étapes, le nombre de commentaires que vous avez spécifié s’affichera au chargement initial de la page.
Utiliser des avatars hébergés localement ou sur votre CDN
WordPress a un support intégré pour Gravatar. Cela signifie que tout utilisateur ayant un compte Gravatar verra son image personnalisée ajoutée en tant qu’avatar lorsqu’il commente sur un blog en utilisant le système de commentaires WordPress natif. Cela ajoute un joli élément personnalisé à la section commentaires, mais à un coût considérable. Lorsque les commentaires WordPress sont chargés, chaque Gravatar unique nécessite une requête HTTP. Ainsi, si une page est chargée avec les commentaires de 50 commentateurs différents, 50 requêtes HTTP seront nécessaires pour télécharger tous ces Gravatars. Comme vous pouvez l’imaginer, cela peut avoir un impact considérable sur la vitesse de la page.
Si vous décidez que les Gravatars ne valent pas les requêtes HTTP ajoutées, vous avez deux options. Tout d’abord, vous pouvez désactiver complètement les avatars en allant dans Paramètres > Discussion, en trouvant la section Avatars, et en décochant la case Afficher les avatars.
Si vous ne voulez pas prendre une mesure aussi drastique, une autre option est de passer aux avatars hébergés localement. Pour ce faire, installez le plugin WP User Avatar. Une fois l’installation terminée, allez dans Avatars > Paramètres et cochez la case Désactiver Gravatar et utilisez uniquement les avatars locaux. Si vous n’aimez pas l’avatar par défaut inclus avec WP User Avatar, il y a une image d’utilisateur propre dans ce tutoriel sur l’utilisation des avatars hébergés localement que vous pouvez télécharger et utiliser comme avatar par défaut.
Gardez à l’esprit qu’après ce changement, tous les commentaires seront affichés avec l’avatar par défaut, sauf si les utilisateurs s’enregistrent sur votre site et téléchargent un avatar personnalisé.
Votre dernière option est de charger vos Gravatars sur votre propre CDN. C’est l’approche que nous adoptons sur le blog de Kinsta. 🤓
Utiliser un système de commentaires tiers
Il y a diverses raisons pour lesquelles vous pourriez être intéressé à passer sur un système de commentaires tiers. D’abord, il y a la charge du serveur à laquelle il faut penser. La création et le chargement des commentaires est un processus qui exige beaucoup de ressources. Si la section des commentaires de votre blog est très occupée, alors le transfert de ce travail à un système de commentaires d’un tiers enlèvera cette charge du serveur de votre site.
De plus, les systèmes tiers offrent une meilleure expérience utilisateur que le système de commentaires WordPress natif. Ils peuvent également encourager plus de visiteurs à commenter puisque les visiteurs qui ont déjà un compte avec le système tiers peuvent commenter immédiatement sans avoir à s’inscrire ou à fournir des détails sur votre site.
Dans certains cas, tous ces avantages se concrétisent. Cependant, ce n’est pas universellement vrai.
Tout le monde n’aime pas les systèmes de commentaires tiers et d’autres s’inquiètent des données recueillies en arrière plan. De plus, l’idée que les systèmes de commentaires tiers sont plus rapides que les commentaires WordPress natifs semble bonne en théorie, mais les choses ne se passent généralement pas comme ça dans la réalité.
Si vous décidez d’utiliser un système de commentaires d’un tiers, faites-le parce que vous aimez l’expérience d’utiliser ce système particulier et parce que vous êtes convaincu que les visiteurs de votre site vont l’aimer autant que vous. Ne vous fiez pas aux commentaires d’un tiers pour obtenir une amélioration perçue de l’affichage qui pourrait être plus théorique que réaliste. Si vous faites le saut vers un système tiers, n’oubliez pas d’envisager la mise en œuvre de la stratégie suivante : le chargement en lazy load.
Commentaires en Lazy load
Que vous utilisiez des commentaires WordPress natifs ou un système tiers, le chargement en lazy load des commentaires est une technique qui va presque certainement accélérer le temps de chargement de votre page. Les systèmes de commentaires qui sont chargés en lazy load sont supprimés du rendu de la page initiale et chargés soit par JavaScript lorsque le visiteur atteint un certain point dans la page ou en cliquant sur un bouton qui dit quelque chose comme « Voir les commentaires ».
Si l’implémentation d’un chargement en lazy load semble un peu technique à implémenter, c’est parce que c’est le cas. Heureusement, vous n’avez pas à le découvrir. Il y a des plugins que vous pouvez utiliser pour charger le système de commentaires que vous avez choisi en lazy load.
Commentaires natifs de WordPress en Lazyload
La possibilité de charger en lazy load les commentaires n’est pas intégrée dans le noyau WordPress. Cependant, une grande solution légère et gratuite que nous recommandons est le plugin Lazy Load for Comments.
Le plugin est disponible dans le répertoire des plugins WordPress. Vous pouvez donc l’installer directement depuis la zone d’administration de WordPress. Ceci réduira le nombre de requêtes HTTP en chargeant en lazy load tous les gravatars WordPress. Il est très simple à configurer. Il suffit de l’installer et sous les paramètres de discussion, il y a deux options. Par défaut, il est réglé sur « On Scroll », ce qui est probablement ce que la plupart des gens préfèrent. Vous pouvez aussi le régler sur « On Click » qui créera un bouton sur lequel les visiteurs pourront cliquer avant le chargement des commentaires.
Une autre option pour charger en lazy load les commentaires natifs est d’utiliser le plugin wpDiscuz.
Une autre option pour charger en lazy load les commentaires natifs est d’utiliser le plugin wpDiscuz.
- Allez dans Extensions > Ajouter.
- Recherchez « wpDiscuz », et sélectionnez le boutonInstaller maintenant.
- Une fois le plugin installé, allez dans Commentaires > Paramètres.
- Faites défiler vers le bas jusqu’à ce que la ligne indiquant le type de chargement/pagination des commentaires s’affiche et sélectionnez le bouton radio pour Chargement en Lazy load des commentaires sur le défilement.
- Ensuite, allez dans Paramètres > Discussion.
- Dans la section Autres paramètres de commentaires, réduisez le nombre de commentaires dans la boîte de dialogue qui suit les mots « Séparer les commentaires en pages« .
- Utilisez un petit nombre, moins de dix, et enregistrez les modifications.
- Veillez à ne pas cocher la case à côté de cette ligne. Si vous cochez cette case, la pagination par défaut des commentaires WordPress remplacera la fonction de chargement en lazy load implémentée par wpDiscuz.
Maintenant, lorsque vous visitez une page avec plus de dix commentaires, seuls les dix premiers commentaires seront chargés. Les commentaires supplémentaires se chargeront automatiquement dès que vous atteindrez le bas de la section des commentaires.
Lazy Load pour Disqus
Si vous utilisez Disqus, il est très important que vous chargiez en lazy load les commentaires Disqus. Si vous ne le faites pas, Disqus peut être un réel obstacle à la vitesse de chargement de votre site. Cependant, le chargement en lazyload des commentaires Disqus peut accélérer votre site par rapport aux commentaires WordPress natifs.
Disqus Conditional Load est un plugin gratuit que vous pouvez utiliser pour charger disqus en lazy load sur votre site. Si vous n’avez jamais utilisé Disqus auparavant, vous devrez d’abord ouvrir un compte et ajouter un nouveau site à Disqus. Une fois que vous avez configuré votre site Disqus, installez Disqus Conditional Load en allant dans Extensions > Ajouter, en recherchant « Disqus Conditional Load », et en sélectionnant Installer maintenant.
Une fois l’installation terminée, allez dans Commentaires > Disqus et sélectionnez Mettre à niveau pour configurer votre base de données afin qu’elle fonctionne avec disqus. Sur l’écran suivant, connectez-vous à Disqus en utilisant votre nom d’utilisateur et votre mot de passe Disqus. Dans l’écran suivant, sélectionnez le site Disqus que vous avez ajouté quelques minutes auparavant et cliquez sur le boutonSuivant. Après avoir terminé cette dernière étape, Disqus sera installé sur votre site et configuré pour se charger en lazy load lorsque les lecteurs accèdent à la section commentaires de votre blog.
Nous utilisons en fait ce plugin sur le blog de Kinsta et nous le recommandons fortement. En plus de charger en lazy load toutes les images (avatars), il vous permet également de désactiver le script de comptage si vous ne l’utilisez pas. Donc un appel JavaScript en moins sur votre site WordPress.
Lazy Load pour Facebook Comments
Le même développeur du plugin Disqus Conditional Load mentionné ci-dessus a également créé un plugin gratuit pour charger en lazy load les commentaires Facebook sur votre site WordPress. Les scripts de Facebook sont connus pour enliser un site Web, même si les scripts sont chargés de manière asynchrone.
Lazy Facebook Comments est un plugin gratuit que vous pouvez utiliser pour charger des commentaires lors du défilement ou lors d’un simple clic. Ainsi, vous êtes sûr de ne charger les scripts Facebook que lorsqu’ils sont nécessaires. Vous pouvez également ajuster le nombre de commentaires, le schéma de couleurs, la langue, la largeur, l’ordre de tri, etc.
Résumé
Les commentaires sont une caractéristique essentielle de la plupart des blogs, mais une section de commentaires en plein essor peut vraiment ralentir la vitesse de chargement de votre site. Vous pouvez accélérer les commentaires et votre site Web WordPress en optimisant les commentaires WordPress natifs et en chargeant en lazy load les commentaires pour les supprimer du chargement initial de la page.
Jon is the Chief Operating Officer at Kinsta and is involved with Kinsta's sales, customer service, and technical support teams on a daily basis. Jon's a family man. So when he isn't feverishly tapping the keys of his laptop he's usually helping one of his kids fix a bike or setting up Netflix for an impatient preschooler.
Laisser un commentaire