Comment réduire le temps de chargement de la page sur WordPress : L’ajoute des attributs Defer et async

Le temps de chargement d’une page est souvent impacté par des ressources qui entravent le rendu. Parfois, ces ressources incluent des balises HTML ou du CSS qui ne sont pas nécessairement requises pour le chargement de la page. Sur WordPress, divers éléments peuvent entraver le chargement ou ralentir une page. Certains plugins sont généralement utilisés pour résoudre d’autres problèmes, mais l’utilisation d’un plugin pour résoudre un problème de chargement peut parfois engendrer d’autres problèmes. Les plugins sont des outils utilisés dans WordPress pour modifier ou apporter des solutions au thème, en particulier lorsque l’on n’a pas une maîtrise solide du HTML, du CSS ou des bases solides en JavaScript. Je recommande généralement aux débutants d’utiliser des plugins pour le développement de leur site sur WordPress s’ils ne maîtrisent pas suffisamment le JavaScript, le HTML et le CSS.

L’élément le plus important lors de l’utilisation de plugins est de trouver un plugin compatible avec le thème utilisé. Le FLP (First Layout Paint) et le TTFB (Time To First Byte) sont des indicateurs de performance utilisés pour mesurer la vitesse et la rapidité d’affichage d’une page dans les premiers résultats des moteurs de recherche. Le TTFB correspond à l’intervalle entre l’envoi de la requête pour obtenir la page et la réception du premier octet. Il doit être inférieur à 400 microsecondes. Quant au FLP, il représente le temps de chargement de la page et doit être inférieur à 300 microsecondes.

Le plugin que j’ai utilisé pour résoudre le problème qui s’est présenté s’appelle Async JavaScript. Il a été conçu pour optimiser au maximum la vitesse de chargement d’une page en utilisant les attributs « async » et « defer ». Avant de les utiliser, la première étape consiste à analyser la page du site web. Pour cela, vous pouvez utiliser l’outil de Google appelé PageSpeed Insights. Cet outil vous fournit des informations sur l’accessibilité de la page, ses performances, les bonnes pratiques et sa valeur SEO. Une fois que vous avez identifié les fichiers CSS qui ralentissent la vitesse de la page, il vous suffit d’installer le plugin Async JavaScript.