On voit souvent de plus en plus de WordPress arriver sur internet, c’est que le produit est bon mais celui-ci souffre quand même de quelques inconvénients, notamment, comment le sécuriser correctement ? comment gérer la montée en charge ? nous avons réussi à répondre à toutes ces problématiques grâce à GatsbyJS qui nous permet d’utiliser WordPress comme CMS et du React en “front” (ce qui s’affiche sur votre navigateur)
Tout commence par un CMS : WordPress
Rappelons la base de la base d’un CMS, celui-ci a pour objectif de gérer votre contenu et c’est son principal intérêt. En effet, pour ceux qui ne sont pas à l’aise avec la langue de Shakespeare, CMS veut dire Content Management System ou Système de gestion de contenu.
Nous avons, comme beaucoup, voulu initier ce blog sous WordPress pour ne pas perdre trop de temps et mettre en ligne rapidement quelque chose de correct mais ce sont posés les problèmes de la maintenance de celui-ci, de la performance de celui-ci et du référencement. Nous utilisions de base un thème assez gourmand (au passage encore en production à certains endroits) et avions des problèmes de performance, des problèmes de mise à jour du thème et puis l’incompatibilité avec les plugins de cache pour accélérer toute cette mixture.
Le temps de la réflexion
Au fur et à mesure de nos recherches, nous sommes tombés sur des articles parlant de HeadLess CMS (un CMS sans tête ou sans devanture). L’idée qui est derrière est de remettre l’église au milieu du village en le laissant gérer le contenu, l’affichage étant délégué à autre chose de spécialisé. Ainsi, on découple le CMS de la partie que le visiteur voit.
Nous sommes tombés sur GatsbyJS et NextJS, notre choix s’est porté sur GatsbyJS pour ce blog.
Le temps de la réalisation
Sauter le pas vers GatsbyJS a été un peu douloureux au début (il faut connaître React) mais de fil en aiguille, nous avions un résultat plus que satisfaisant et pouvions garder notre contenu sous WordPress, sans tout devoir remettre en question. A l’heure actuelle, c’est toujours le cas puisque ces lignes sont écrites avec la jolie pratique interface WordPress. GatsbyJS se sert d’une API GraphQL que WordPress expose.
Cette interface WordPress dédiée à ce blog est cachée sur internet et n’a même nullement besoin d’être accessible constamment, juste au moment ou GatsbyJS a besoin de générer ses pages Web
Le temps du résultat
Vous pouvez apprécier la fluidité et la rapidité de chargement de ce blog, tout cela est du au fait que GatsbyJS est optimisé mais aussi que les pages ne consomment rien du tout en terme de CPU et de mémoire. En effet, le résultat est directement envoyé à votre navigateur internet.
Quels en sont les gains ?
- Temps de chargement extrêmement optimisés donc une meilleure indexation et un meilleur classement par les moteurs de recherches
- Très peu de consommation mémoire / cpu, ce qui fait que l’hébergement est moins cher
- Meilleure montée en charge car on ne consomme plus grand chose côté serveur
- Plus d’erreur 500 du à des problèmes techniques liés à la génération de code HTML côté serveur. Si la base de données n’est pas là, ce n’est pas grave
- Plus d’adhérence entre ce qui est vu par le visiteur et ce qui gère le contenu, on peut même changer de gestionnaire de contenu sans devoir refaire son site internet
- Plus de problème de sécurité, en effet, le CMS est caché d’internet, les pages générées sont des pages statiques (qui dit pages statiques ne fit pas forcément pages ne pouvant contenir de formulaire ou de parties dynamiques)
Nous prenons comme témoin notre ami Google et son outil de test des pages
Résultat du test pagespeed sur Smartphone
Un retour en arrière impossible
Nous ne reviendrions pour rien au monde en arrière. En effet, nous avons la conscience tranquille et savons pertinemment que nous ne risquons plus de faille de sécurité lié à de la négligence d’un développeur quelconque et plus aucun problème de temps de chargement car le résultat est constant (les serveurs n’ont plus de calcul à réaliser)
