Contexte & Defi
L'entreprise
MECA SERVICES est une PME specialisee dans la vente de materiel de motoculture, implantee en zone rurale avec un point de vente physique et une plateforme e-commerce. L'entreprise gere un catalogue de plus de 1,3 million de references, necessitant une infrastructure robuste et performante.
Le probleme
L'infrastructure PrestaShop existante souffrait d'une obsolescence marquee : interface vieillissante, PHP 7.2 en fin de vie, dette technique accumulee, et failles de securite non corrigees. La maintenance etait devenue un gouffre de temps et de ressources.
La contrainte majeure
Contrairement aux grands groupes disposant d'equipes pluridisciplinaires, MECA SERVICES ne pouvait compter que sur un seul developpeur pour mener cette refonte. Il fallait donc privilegier des solutions maximisant l'efficacite tout en minimisant la complexite operationnelle.
Etat des lieux avant refonte
Comment reconstruire une infrastructure e-commerce fiable, durable et adaptee aux contraintes d'une PME etant seul developpeur, tout en integrant les enjeux de performance, accessibilite et eco-conception ?
Approche & Methodologie
Architecture hexagonale
Le choix s'est porte sur une architecture hexagonale (Ports & Adapters). Cette approche separe strictement le domaine metier des couches techniques, facilitant les tests, la maintenance et les evolutions futures.
- Domaine isole : La logique metier ne depend d'aucun framework
- Testabilite maximale : Chaque couche testable independamment
- Adaptateurs interchangeables : Changement de BDD ou d'API sans impact metier
Migration Big Bang
Le changement complet de stack technique (PrestaShop/MySQL vers SvelteKit/PostgreSQL) imposait une migration Big Bang. L'incompatibilite des bases de donnees rendait impossible une migration progressive type Strangler Fig.
Strategie mise en place
- Developpement complet en parallele de l'ancien systeme
- Phase de tests intensifs avant bascule
- Migration des donnees via scripts ETL dedies
Stack Technique
Pourquoi SvelteKit ?
Face a Next.js, Nuxt ou Remix, SvelteKit s'impose par sa philosophie unique : compiler plutot qu'interpreter. Pour un developpeur solo gerant un projet complexe, c'est un avantage decisif.
- Complexite cognitive minimale : Syntaxe intuitive proche du HTML/CSS/JS natif. Pas de JSX, pas de hooks complexes, pas de magie cachee. Le code fait exactement ce qu'il dit.
- Maintenabilite exceptionnelle : Un composant = un fichier. La reactivite est declarative, pas imperative. Reprendre le code apres 6 mois reste simple.
- Bundle size ridicule : Svelte compile en JavaScript vanilla. Pas de runtime de 40Ko+ comme React. Le bundle final est 2 a 5x plus leger.
- Performance native : Sans Virtual DOM, les mises a jour sont chirurgicales. Le navigateur travaille moins, l'utilisateur percoit plus de fluidite.
Comparatif frameworks
| Critere | SvelteKit | Next.js | Nuxt |
|---|---|---|---|
| Bundle size | ~5 Ko | ~80 Ko | ~60 Ko |
| Complexite cognitive | Faible | Elevee | Moyenne |
| Developer Experience | Excellente | Bonne | Bonne |
| Performance runtime | Native | VDOM | VDOM |
| Maintenabilite solo | Ideale | Difficile | Moyenne |
Enjeux RSE
Accessibilite
Conformite aux normes WCAG 2.1 niveau AA et au referentiel RGAA 4.1.2. Obligation legale depuis l'European Accessibility Act (juin 2025).
- Checklist RGAA integree au workflow
- Composants accessibles by design
- Tests utilisateurs avec handicap
Eco-conception
Application des principes du RGESN (Referentiel General d'Ecoconception des Services Numeriques) pour minimiser l'impact environnemental.
- Optimisation images (WebP, lazy loading)
- Hebergement responsable
- Code efficient, requetes minimisees
DevOps & Qualite
Pipeline CI/CD automatise pour garantir la qualite du code et la stabilite des deploiements. Integration de tests et monitoring continu.
- GitHub Actions + SonarCloud
- Tests unitaires & E2E (Vitest, Playwright)
- Monitoring & alerting
Resultats & Impact
Metriques avant / apres
| Metrique | Avant | Apres |
|---|---|---|
| LCP (Largest Contentful Paint) | 4.2s | 1.1s |
| FID (First Input Delay) | 180ms | 12ms |
| CLS (Cumulative Layout Shift) | 0.18 | 0.02 |
| Score Lighthouse | 42 | 95+ |
| Accessibilite RGAA | Non conforme | Niveau AA |
| Empreinte carbone / page | 2.8g CO2 | 0.4g CO2 |
| Temps maintenance / semaine | 15h | 3h |
Impacts business
Interface simplifiee, processus automatises, moins d'interventions manuelles.
Experience utilisateur fluide, temps de chargement reduits, navigation intuitive.
Pret pour l'European Accessibility Act et les exigences RGPD.
Core Web Vitals optimises, structure semantique, performance mobile.
"Eliott a repense notre infrastructure e-commerce et nos outils internes. En seulement un an d'alternance, il a transforme notre dette technique en une infrastructure scalable et performante, posant les bases d'une croissance durable."
