Pour optimiser vos ventes en ligne, votre site E-commerce ne peut se contenter d’être séduisant visuellement et doté de fonctionnalités classiques telles que la commande et le paiement en ligne. En effet, elle doit aussi être accessible et fonctionnelle partout et tout le temps, quel que soit le support utilisé : desktop, smartphone, tablette.  Et c’est d’ailleurs, ce que permettent  les PWA (Progressive Web App) ! Des applications qui conjuguent les avantages des applications mobiles et ceux des sites internet. Différentes solutions sont disponibles sur le marché, parmi elles figurent Vue Storefront, une des PWA e-commerce les plus complètes.

Créé en 2017, Vue Storefront adresse des solutions concrètes aux enjeux modernes du E-Commerce en offrant des expériences d’achat semblables à celles des applications natives, tout en améliorant les performances de votre site E-Commerce. Techniquement, il s’agit d’un front-end Headless pouvant fonctionner avec les back-ends les plus populaires du marché, dont Adobe Commerce (Magento), Shopify, BigCommerce De plus, la solution dispose de nombreux outils et fonctionnalités. Elle évolue régulièrement, ce qui lui permet d’être optimisée au regard des dernières tendances.

Le 20 juillet 2022, Vue StoreFront a annoncé une grande nouvelle : l’intégration de la version 2 à Magento  (Adobe Commerce) !  Cela permet à des milliers de boutiques en ligne sur Adobe Commerce (Magento) d’utiliser la solution front open source Vue Storefront. De quoi accélérer les chargements de pages, améliorer les performances Web et augmenter les taux de conversion.

Une première solution front native Headless et agnostique disponible sur Adobe Commerce (Magento) 

Vue Storefront est la solution frontend et agnostique, la plus développée disponible pour Adobe Commerce. En étant désormais disponible sur cette plateforme, la version débloque un ensemble de nouveaux outils qui améliorent les performances Web des boutiques en ligne.

Pensée pour être une solution qui offre une liberté de choix et de simplicité, Vue Storefront offre un Starter Kit entièrement personnalisable pour les développeurs Magento afin qu’ils puissent se concentrer sur le développement des besoins métiers et non aux features de bases telles que la gestion du SSR, la gestion du mode offline, etc.  Ainsi, vos équipes techniques seront plus productives et vous êtes en mesure de proposer une expérience ultra-personnalisée ! 

Concrètement, la nouvelle intégration couvre les principales fonctionnalités de la plateforme Adobe Commerce (Magento)  : 

  • Le flux de paiement, 
  • L’administration des droits utilisateurs,
  • Les comptes clients,
  • Les catégories de produits, 
  • Les contenus CMS,
  • La page de recherche,
  • Les pages produits complètes et détaillées (vidéos, photos, wishlist, review).

Vue Storefront 2 : une nouvelle version plus puissante

Une solution évolutive 

Le lancement de l’intégration à Adobe Commerce (Magento) est un événement historique puisqu’il marque la fin officielle de Vue Storefront 1. La nouvelle version de la solution est désormais basée sur Nuxt : un méta-framework populaire et extrêmement puissant construit sur Vue.js qui propose une excellente expérience de développement et assure des mises à jour et des améliorations constantes aux niveaux micro et macro. 

DnD-Vue-storefrotn-image

L’une des principales raisons pour lesquelles la solution a décidé de migrer vers Nuxt est son écosystème. Il existe plus de 200 modules officiels (et des milliers de modules non officiels) disponibles pour les utilisateurs de Vue Storefront. Chaque utilisation d’une application en ligne (Single Page Application) ou d’une intégration avec un outil connu est désormais réalisable en un rien de temps grâce aux modules Nuxt. De plus, cet outil prend en charge plusieurs options de déploiement telles que SSG, SSR, CSR et hybride et chacune est hautement configurable. À présent, vous pouvez vous concentrer sur la construction des composants spécifiques à votre projet, et non sur un travail de fond répétitif.

Une solution plus rapide 

Dnd-Vue Storefront 1 vs VSF 2

L’intégration de Vue Storefront 2 permet d’obtenir en moyenne 20 à 30 % de meilleures performances sur les pages d’accueil, de produit et de catégorie par rapport à Vue Storefront 1.  Pourquoi ? Car les équipes de la solution ont misé sur une simplicité de déploiement. En effet, l’un des problèmes majeurs de Vue Storefront 1 était la complexité de son architecture. L’objectif était alors, de pallier la lenteur de Magento mais la solution avait un coût dû  à  la difficulté de l’hébergement d’ElasticSearch et de l’API Vue Storefront. 

Cependant, les équipes de Vue Storefront ont trouvé une solution : la version 2 est exécutée par Nuxt, ce qui simplifie le développement d’applications Vue.

L’utilisation de GraphQL 

Dnd-Vue Storefront 1 vs VSF 2 graphic ql

Toutes ces améliorations ne sont que la cerise sur le gâteau. L’intégration de Vue Storefront 2 exploite l’API native Magento 2 GraphQL pour garantir la meilleure expérience de développement. De plus, la solution introduit désormais des optimisations qui diminuent l’impact de la couche GraphQL sur la taille du bundle, en particulier lorsqu’il y a beaucoup de requêtes et de mutations.

Conclusion

Vue Storefront est une application front-end indépendante qui communique avec Adobe Commerce (Magento) via une API et présente tous les avantages de l’architecture headless. Comme toute solution Headless, Vue Storefront est à privilégier si vous êtes un E-Commerçant utilisant déjà une multitude de microservices, ou souhaitant évoluer vers cette architecture. L’avantage d’avoir un connecteur Adobe Commerce (Magento), vous permet de passer du monolithe vers le Headless sans refondre votre partie E-Commerce. En somme, l’intégration de la solution à Adobe Commerce (Magento) est une opportunité pour accroître  votre rayonnement sur le marché, et proposer une expérience client unique. Vue Storefront 2 vous offre une solution rapide et flexible, qui s’adapte à vos besoins. 

Vous avez des questions sur l’intégration VSF à Magento ? Ou sur la PWA ou le Headless ? 

Spécialisée dans le E-Commerce, l’Agence Dn’D accorde une attention particulière aux meilleures pratiques de développement technologique. Notre expertise sur la PWA de Vue Storefront et sur Adobe Commerce (Magento) constitue un duo complet pour mener à bien votre projet E-Commerce. Si vous souhaitez une PWA autonome, n’hésitez pas à nous contacter ! 

Vous avez aimé ?

0