Shopify Liquid vs Hydrogen : quelle différence concrète pour mon site

“Hydrogen” et “Liquid” reviennent souvent dans les mêmes phrases sans que la différence soit claire pour qui ne fait pas de dev au quotidien. Voici ce que ça change concrètement, sans jargon inutile.

Liquid, la base historique de Shopify

Liquid est le langage de templating natif de Shopify. Quand vous installez un thème (gratuit ou payant), il est écrit en Liquid. Le serveur Shopify génère la page HTML directement à partir de ces templates, avec le contenu du back office injecté dedans.

C’est un système éprouvé, rapide à mettre en place, et qui couvre bien les besoins standards d’un e-commerce classique. La contrepartie : vous travaillez dans les limites de ce que le thème et Liquid permettent. Chaque personnalisation un peu poussée passe soit par une app tierce, soit par du code Liquid custom ajouté au thème, ce qui finit par s’accumuler avec le temps.

Hydrogen, le framework headless de Shopify

Hydrogen est un framework basé sur React (via Remix) fourni par Shopify pour construire un storefront entièrement custom, qui communique avec le back office Shopify via API plutôt que par templating direct. Le storefront tourne sur Oxygen, l’hébergement edge de Shopify.

Concrètement, ça veut dire que le front (ce que voit le client) est complètement découplé du back (catalogue, commandes, paiement). Vous gardez l’admin Shopify tel quel pour les opérations, mais le site public est un projet de développement à part entière, avec un contrôle total sur chaque élément affiché.

Les différences qui comptent vraiment

Performance. Un thème Liquid chargé d’apps tierces accumule des scripts qui ralentissent le rendu. Sur Hydrogen, il n’y a pas d’apps front end au sens classique : les fonctionnalités sont codées directement, ce qui élimine ce facteur de ralentissement quasi systématique sur les thèmes anciens.

Liberté de design. Sur Liquid, chaque interaction custom demande de composer avec les contraintes du thème. Sur Hydrogen, il n’y a pas de contrainte de thème puisque le front est écrit sur mesure. Ce qui est imaginable en React est réalisable.

Coût de développement. C’est le vrai compromis. Un thème Liquid personnalisé coûte moins cher à mettre en place qu’un storefront Hydrogen complet, parce qu’on part d’une base existante. Hydrogen demande un vrai projet de développement, ce qui a du sens quand les limites de Liquid deviennent un frein business réel, pas systématiquement.

Maintenance. Un thème Liquid se maintient avec des compétences Shopify standards, largement disponibles sur le marché. Un storefront Hydrogen demande des compétences React/Remix, un profil plus spécifique mais aussi plus aligné avec l’écosystème dev moderne.

Vitesse d’itération produit. Sur Liquid, ajouter une fonctionnalité avancée passe souvent par chercher une app compatible, avec le risque de dépendance et de coût récurrent que ça implique. Sur Hydrogen, la fonctionnalité se code directement, sans dépendance à un tiers ni abonnement supplémentaire.

Quand Liquid suffit encore

Il ne s’agit pas de dire qu’Hydrogen est toujours la bonne réponse. Un petit catalogue avec des besoins standards, peu de personnalisation avancée et un budget dev limité, reste parfaitement servi par un bon thème Liquid bien entretenu. Le passage à Hydrogen se justifie quand la performance, le design ou la vitesse de développement produit deviennent des freins mesurables à la croissance.

Comment savoir où vous en êtes

Les signes qui indiquent qu’un thème Liquid a atteint ses limites : un score Core Web Vitals qui stagne malgré les optimisations classiques, une facture d’apps qui augmente chaque trimestre, ou une roadmap produit ralentie parce que chaque nouvelle idée se heurte aux contraintes du thème.

Si c’est votre cas, le parcours de migration Shopify vers Hydrogen détaille comment l’audit initial permet de vérifier si le passage headless est réellement justifié avant de se lancer.