Développement web

Granularité et sources externes, les deux plaies de WordPress

J’ai à plusieurs reprises traité du sujet de l’amélioration des performances et de la rapidité d’un site web en privilégiant l’installation d’extensions et la mise en place d’outils. Nous avons ensemble vu comment optimiser, analyser, détecter et améliorer notre petite usine à contenu qu’est WordPress. Malheureusement ou heureusement, certaines actions ne peuvent être que manuelles, en plongeant les mains dans le cambouis ! Nous allons donc voir ici comment grappiller quelques millisecondes, voire secondes, en temps de chargement, ce qui n’est pas négligeable.

Un tiens vaut mieux que deux tu l’auras

Le plus grand problème de WordPress, qui est aussi sa force, est son extrême modularité : thème, extensions, extensions d’extensions, modules, etc. Ce qui permet d’installer facilement ce que vous souhaitez. Mais deux obstacles surviennent alors : la granularité des fichiers et leur duplication. Plus vous aurez d’extensions, et plus votre site chargera des fichiers. Les fichiers sont plus nombreux à se charger et le temps de chargement s’en ressent grandement.

Comment remédier à cela ? Il n’est pas recommandé d’aller modifier les extensions pour fusionner les fichiers. L’une des raisons principales à cela est les mises à jour : si elles ont lieu, toutes vos modifications seront effacées. Par contre, une action assez simple est de limiter les petites extensions, qui chargent toute une arborescence de fichiers pour une simple fonctionnalité. Par exemple, je souhaite mettre un code de tracking sur mon site. Plutôt que de me ruer sur le store pour trouver une extension, je vais passer un peu de temps sur la plateforme pour copier-coller mon code de tracking directement dans mon site. Cela ne nécessite pas d’énormes compétences et ce sera bien plus léger qu’une extension. Il faut bien comprendre qu’une extension, pour fonctionner, nécessite une structure particulière, de nombreux fichiers, pour être autonome et fonctionner sur tous les sites. Il en résulte un ensemble dense qui, pour une petite fonctionnalité, est bien plus lourd et important en poids et nombre de fichiers.

Vous pouvez aussi agir sur tous vos fichiers qui ne sont pas liés aux extensions, mais qui sont liés à votre thème, et tenter de les concaténer le plus possible, afin de limiter le nombre de fichiers. Attention, avoir un seul grand fichier javascript ou css n’est pas forcément la meilleure solution : il faut trouver le juste milieu entre nombre de fichiers et fonctionnalités. Si une page regroupe un style particulier ou un fonctionnement spécifique, il vaut mieux séparer cela dans un fichier et autant que possible le charger, que sur la page en question.

Come back

Comme tout site, le vôtre va charger de nombreuses ressources et bibliothèques utiles à son chargement. Vous dépendez donc de différents sites & CDN (content delivery network) pour charger l’ensemble de ces ressources, et si un CDN met du temps à répondre, votre site en est directement affecté. Une des alternatives est de tout charger en local. Cela peut être une très bonne opération si votre site dispose de son propre CDN !

Si votre site est correctement réalisé, vous devrez trouver dans le fichier function.php (ou un autre) les termes suivants : « wp_enqueue_style » et « wp_enqueue_script » qui permettent respectivement de charger les styles css et les scripts javascripts. Si des URL sont présents, vous pouvez tenter de les modifier et voir si cela améliore ou non le temps de chargement de votre site. Pour cela, entrez, à la place de votre URL, la ligne suivante :

get_template_directory_uri(). »/votre/chemin/vers/le_fichier.js »

N’oubliez pas de télécharger votre fichier depuis l’url en amont et de l’insérer dans les fichiers de votre site.
Autre astuce pour limiter le poids du fichier : certaines bibliothèque comme Jquery UI permettent de choisir quelles fonctionnalités vous souhaitez avoir dans le fichier, ce qui permet de n’avoir que le nécessaire.

Bien entendu, pour réaliser ces actions, vous devrez posséder quelques compétences et notions. Je n’explique pas dans le détail les actions, car il ne s’agit pas réellement d’un tutoriel mais plutôt de conseils et astuces pour améliorer un peu plus son site. Cela étant dit, ces deux actions certes basiques font souvente gagner en temps de chargement, même si elles sont plus fastidieuses que simplement activer une extension ou acheter un service. Je ne peux que vous recommander de vous y pencher, et, de manière plus générale, de veiller à l’optimisation de votre site. Cet aspect est de plus en plus pris en compte par les moteurs de recherches, pour votre référencement.

Si cet article vous a plu, nous vous invitons à découvrir notre agence wordpress et à télécharger notre livre blanc « Les 11 commandements d’un site internet qui convertit vos visiteurs en clients »

Mathieu Benhalima

Titulaire d’un Master de chef de projet multimédia, adepte de l’expérimentation, j’ai occupé diverses fonctions chez Schneider Electric et Indexel pendant mes années d’études en alternance : technicien du web, administrateur réseau, intégrateur. J’ai aujourd’hui trouvé ma voie : développeur web. Recruté en 2015 par 1min30, je suis le référent technique et le responsable qualité des sites produits par l’agence. J’anime maintenant une équipe de développeurs. Veilleur infatigable, je suis à l’affût de toutes les nouveautés et travaille en osmose avec les chefs de projet. Vous souhaitez un site performant ? Une infographie animée utilisant les dernières technologies ? Je serais ravi de partager avec vous vos objectifs et de mettre en place la meilleure solution. Contactez-moi et avançons ensemble, ensemble construisons le web de demain.