Architecture

L'architecture de l'hébergement Zento est construite sur le cloud, avec l'objectif clair de réaliser la performance, la flexibilité, la fiabilité, la sécurité et l'efficacité financière de votre magasin.

Les solutions d'hébergement traditionnelles font fonctionner un magasin sur un seul serveur, dédié ou virtuel : toutes les requêtes entrantes (via le frontend, le backend, l'API) et les lots de tâches en arrière-plan (par exemple les mises à jour produit) sont traitées par le même serveur. Cette configuration pose plusieurs problèmes du point de vue fiabilité et flexibilité, déjà couvertes dans l'article Hébergement cloud.

Tous les composants de l'hébergement Zento sont créés ayant comme cibles la fiabilité et la flexibilité. L'architecture applicative comporte les composants suivants :

• - un frontend PWA

• - le backend Magento 2

• - stockage, base de données et caching

• - service de redimensionnement des images

Zento utilise le dernier cri en termes de réseau de diffusion du contenu ou CDN : AWS CloudFront. Selon l'adresse demandée (URL) les appels sont acheminés selon le schèma suivant :

• - Magento 2 GraphQL API et Magento admin ⇒ Kubernetes (EKS)

• - JS, CSS et autres images statiques ⇒ S3

• - Fichiers média y inclus les images des produits et du contenu ⇒ S3

• - Redimensionner et optimiser les images ⇒ Lambda (Resizer)

• - Toutes les autres requêtes ⇒ Lambda (SSR)

Tous les appels sont protégés par le pare-feu AWS Web Application Firewall (WAF) pour pallier aux failles web les plus communes peuvant affecter la disponibilité, compromettre la sécurité, ou consommer trop de ressources.

Des journaux détaillés d'accès concernant tout le trafic et incluant le temps de réponse, le navigateur (user agent) et l'utilisation consistante du cache sont stockés dans S3 et peuvent être analysés ou exportés ultérieurement.

Rendu côté serveur (Server Side Rendering ou SSR)

Lorsqu'une page web est chargée, le navigateur de l'utilisateur charge le contenu HTML de la page, les fichiers JavaScript contenant la fonctionnalité de l'application, le CSS qui apporte les feluilles de style de l'application, et bien entendu les images.

Même si la partie JavaScript de l'application (la partie PWA) est tout à fait capable à elle seule de préparer n'importe quelle page du site, c'est important que la réponse initiale HTML contient la page entière rendue exactement comme le navigateur l'aurait fait. Cela permet au navigateur d'afficher la page déjà stylisée, sans avoir à attendre le téléchargement des scripts. Cette fonction s'appelle rendu côté serveur ou Server Side Rendering (SSR).

Ces chargement SSR sont exécutés utilisant AWS Lambda, l'implémentation fonction-comme-un-service Serverless d'AWS. Cela résulte en une parfaite flexibilité avec les coûts selon l'utilisation réelle.

Vous pouvez lire plus sur ce sujet dans PWA sur Lambda

Magento 2 sur Kubernetes

Les appels API faits par le PWA ou par l'accès administrateur à l'interface backend de Magento 2 sont acheminés vers le cluster Kubernetes s'exécutant sur AWS EKS.

Chaque magasin possède plusieurs pods s'exécutant sur des différents nœuds sur lesquels la charge est distribuée (load balanced) pour servir toutes les requêtes entrantes. Pendant les pics de trafic des nouveaux pods sont automatiquement créés en quelques secondes. Ils seront ensuite libérés automatiquement après la baisse du trafic. A n'importe quel moment un jeu minimal de pods est préservé pour assurer la résilience, donc même dans les cas extrêmement rares de défaillance matérielle le magasin pourra garder une disponibilité parfaite.

Vous pouvez lire plus à ce sujet dans l'article M2 sur Kubernetes

Redimensionner et optimiser les images

Les images qui sont redimensionnées et optimisées utilisant des formats modernes ont des tailles nettement plus réduites que leurs versions non compressées. En conséquence c'est crucial de servir des images optimisées à la bonne taille et dans des formats modernes pour que les navigateurs récents puissent en tirer profit, pour une excellente performance et pour votre SEO.

Les solutions traditionnelles peuvent redimensionner les images et même les optimiser, mais souvent les images affichées sur les équipements mobiles peuvent avoir des tailles plus grandes que nécessaire, pénalisant ainsi la performance et la bande passante. Aussi, la plupart des solutions ne convertissent pas les images depuis leur format initial (JPEG ou PNG) vers des formats plus modernes (WEBP ou AVIF), et en plus faire cela seulement lorsque ces formats sont supportés par le navigateur de l'utilisateur.

Le PWA de Zento offre des images dans les formats modernes ou traditionnels et dans les tailles les plus appropriées selon les caractéristiques des navigateurs comme la taille de l'écran et la résolution. Lorsque le navigateur demande une image avec une certaine taille et format, la version redimensionnée, optimisée et au format moderne est automatiquement servie par le serveur. Le redimensionnement est fait par une tâche Lambda serverless et mise en cache sur S3 et dans le CloudFront CDN.

Le résultat est un processus de management simple pour le commerçant, une expérience très fluide pour l'utilisateur et des scores de performance optimaux.

Conclusions

En choisissant Zento comme solution e-commerce vous gagnez la performance, la fiabilité, la flexibilité et la sécurité pour votre magasin, pour augmenter vos conversions et rester disponible en ligne même dans les périodes les plus chargée, tout en réduisant au maximum les risques associés avec les failles de sécurité ou avec les solutions qui ne sont pas mises à jour constamment.