Next.js pour le e-commerce : Pourquoi Shopify ou WooCommerce ne suffisent plus
Amazon a prouvé le chiffre : 100ms de latence = 1% de chiffre d'affaires en moins.
Sur un site e-commerce, chaque milliseconde compte. Le visiteur qui attend que la page produit se charge est un visiteur qui n'achète pas.
Shopify et WooCommerce sont des solutions populaires. Mais elles ont des limites fondamentales que Next.js élimine.
Les limites de WooCommerce
WooCommerce transforme WordPress en boutique en ligne. C'est pratique. C'est aussi problématique.
Performance
Un site WooCommerce moyen charge :
- WordPress core
- WooCommerce plugin (lourd)
- Des extensions de paiement
- Des extensions de livraison
- Des extensions de marketing
- Votre thème
- Des plugins de cache pour compenser
Résultat : 5 à 15 secondes de chargement sur mobile. Sur mobile ! Là où 70% des achats commencent.
Sécurité
WooCommerce = WordPress + base de données + panneau admin + plugins de paiement.
Chaque élément est une cible. Les données de cartes bancaires sont une cible encore plus précieuse. Les standards PCI-DSS sont difficiles à respecter sur une architecture aussi complexe.
Coût caché
- WooCommerce : gratuit (en théorie)
- Extensions essentielles : 200-500€/an
- Thème e-commerce : 50-100€
- Hébergement robuste : 50-100€/mois
- Maintenance sécurité : 500-1500€/an
Total réel : 1500-4000€/an. Pas si gratuit.
Les limites de Shopify
Shopify est meilleur que WooCommerce sur beaucoup de points. Mais il a ses propres chaînes.
Personnalisation limitée
Vous êtes dans le "jardin clos" de Shopify. Vous pouvez personnaliser votre thème, mais vous ne contrôlez pas :
- L'URL structure ("/products/" est imposé)
- Le checkout (hors Shopify Plus)
- Les performances réelles (le serveur est partagé)
- Le SEO technique complet
Coût transactionnel
Shopify prend un pourcentage sur chaque vente (0.5% à 2% selon le plan). Sur 100 000€ de chiffre d'affaires, c'est 500€ à 2000€ par an qui partent en commissions.
Vitesse variable
Shopify est rapide... en moyenne. Mais votre site partage les ressources serveur avec des milliers d'autres boutiques. Aux heures de pointe (Black Friday), tout le monde ralentit.
La solution Next.js + Headless e-commerce
"Headless e-commerce" signifie séparer la vitrine (le front-end) du moteur de vente (le back-end).
L'architecture
Vitrine (Next.js) ← API → Moteur e-commerce (Shopify, Snipcart, Commerce.js)
↓
Paiement (Stripe, Mollie)
↓
Livraison (Sendcloud, bpost API)
Le visiteur navigue sur un site Next.js ultra-rapide. Les données produits viennent de Shopify/Snipcart via API. Le paiement est géré par Stripe ou Mollie.
Les avantages
1. Vitesse extrême La vitrine est statique (SSG). Les pages produit se chargent en moins d'une seconde. La conversion augmente mécaniquement.
2. Contrôle total du design Chaque pixel de l'expérience d'achat est contrôlé. Pas de limitation de thème. Pas de checkout imposé.
3. SEO parfait Les pages produit sont du HTML statique, enrichies de schema.org (Product, Offer, Review). Google indexe chaque produit parfaitement.
4. Pas de commissions sur les ventes Avec Snipcart ou une solution custom + Stripe, vous payez juste les frais de paiement (1.4% + 0.25€ pour Mollie). Pas de % à Shopify.
5. Évolutivité
- Ajouter un configurateur 3D ? Possible.
- Un quiz personnalisé qui recommande des produits ? Possible.
- Une expérience AR pour essayer les produits ? Possible.
Sur Shopify ou WooCommerce, chaque fonctionnalité avancée demande un plugin coûteux et souvent limité.
Les solutions e-commerce Headless
| Solution | Forces | Tarif |
|---|---|---|
| Shopify Storefront API | Solide, mature, écosystème riche | 29-299$/mois + 0.5-2% |
| Snipcart | Simple, intégration HTML, pas de CMS imposé | 2% par transaction |
| Commerce.js | API-first, moderne, flexibilité | 79-299$/mois |
| Stripe Checkout | Paiement pur, intégration facile | 1.5% + 0.25€ |
| Medusa.js | Open-source, self-hosted, complet | Gratuit (self-hosted) |
Cas réel : une boutique belge en Next.js
Imaginons une boutique de chocolats artisanaux à Bruxelles.
Avec WooCommerce :
- Site lent (4s de chargement)
- Panier abandonné à 75%
- Maintenance constante
- Coût annuel : 2500€
Avec Next.js + Snipcart :
- Site rapide (0.6s de chargement)
- Panier abandonné à 55%
- Maintenance quasi nulle
- Coût annuel : 300€ (Snipcart sur volume faible)
Résultat : plus de ventes, moins de coûts, moins de stress.
Le checkout, l'endroit où tout se joue
Le checkout est le moment le plus critique. C'est là que les paniers sont abandonnés.
Shopify checkout :
- Rapide, optimisé
- Mais standardisé (même look pour tout le monde)
- Pas personnalisable (hors Plus à 2000$/mois)
Next.js custom checkout :
- Ultra-rapide (pas de rechargement de page)
- Totalement personnalisable
- Upsells et cross-sells intégrés
- Paiement en un clic pour les clients réguliers
- Confirmation instantanée
Vous contrôlez l'expérience de A à Z.
Ce n'est pas pour tout le monde
Le e-commerce Headless demande un développeur compétent. Ce n'est pas une solution "no-code".
C'est pour vous si :
- Vous avez un catalogue de 50+ produits
- La vitesse est critique pour vos conversions
- Vous voulez une expérience unique
- Vous prévoyez de scaler
Ce n'est peut-être pas pour vous si :
- Vous vendez 5 produits simples
- Vous n'avez aucun budget de développement
- Vous préférez la simplicité à la performance
Conclusion
Shopify et WooCommerce ont leur place. Mais pour les marques qui prennent le e-commerce au sérieux, l'architecture Headless + Next.js est l'avenir.
Elle combine :
- La puissance des moteurs e-commerce existants
- La vitesse et le contrôle d'un front-end moderne
- Un coût total souvent inférieur aux solutions traditionnelles
Chez Promto.be, on développe des vitrines e-commerce en Next.js couplées à Snipcart, Shopify Storefront API, ou des solutions sur mesure. La performance de Tesla, le budget d'une PME belge.