par Maxime, développeur web à l’Agence Dn’D
Nous vous en parlions dans un article précédent : les PWA représentent un atout majeur pour les E-Commerçants souhaitant améliorer leurs performances web. Popularisée par Google à partir de 2015, une PWA ou Progressive Web App est un site web ayant intégré des fonctionnalités jusqu’alors réservées aux applications natives. N’étant pas un nouveau concept en soi, les PWA deviennent de plus en plus intéressantes et qualitatives, grâce à l’évolution de nos navigateurs.
De nombreuses PWA existent et chacune possèdent des fonctionnalités qui leur sont spécifiques : du côté de Dn’D, nous avons choisi d’utiliser celle développée par Vue Storefront, dont nous sommes Core Partner depuis mars 2019. Disponible en version 1.10, l’équipe de Vue Storefront prépare une version 2.0 de la PWA, qui apportera son lot de nouveautés en terme de performance pour les E-Commerçants.
On vous en dit un peu plus sur cette sortie imminente !
Rappels sur Vue Storefront
Créée par la société polonaise Divante, Vue Storefront est une solution PWA fondée par Piotr Karwatka (CTO) et Filip Rakowski (CEO) en 2017. Conçue pour aider les E-Commerçants à relever de nouveaux défis au sein de leurs activités, cette solution est réalisée via une licence Open Source MIT. Ainsi, les équipes de Vue Storefront collaborent étroitement avec des contributeurs désireux d’améliorer la solution, en vue de répondre à de nouveaux besoins et aux récentes problématiques rencontrées sur le marché.
Vue Storefront est une PWA autonome Headless rédigée en Vue.js. Le fait que la solution soit basée sur une architecture Headless lui permet de se connecter à n’importe quelle plateforme E-Commerce, ce qui en fait une PWA front-end pour Magento, Shopify, BigCommerce, WooCommerce, Prestashop, Pimcore, etc. Cette caractéristique offre la possibilité aux E-Commerçants de détenir une solution PWA de pointe, garantissant ainsi à leurs clients de bénéficier d’une expérience utilisateur optimale lors de leur parcours d’achat.
Simple à installer, l’équipe de Divante propose des documentations complètes aux développeurs pour garantir un apprentissage rapide de Vue Storefront. Comme en témoigne les références clients de la solution (Forbes, Trivago, Alibaba.com..), Vue Storefront est une PWA performante et sûre, qui compte de plus en plus d’utilisateurs.
Présentation de Vue Storefront 2.0
La version 2.0 de Vue Storefront comporte de nouvelles évolutions, permettant notamment une installation de la PWA plus aisément qu’auparavant, un système de mises à jour nettement amélioré et une bonification de sa courbe d’apprentissage.
Rétro-compatible avec les versions précédentes, Vue Storefront 2.0 se caractérise par une meilleure encapsulation des modules, ainsi que par le déplacement de l’ensemble de la communication core<>theme vers les stores Vuex ; cela se traduit par la simplification de la récupération des données de l’application entre ses différents composants. Cette nouvelle version ne change pas les formats des States Vuex, seuls de nouvelles actions et getters sont ajoutés. En ayant une seule couche de communication, la logique de base peut donc être complètement séparée de la logique thématique, ce qui simplifiera considérablement sa personnalisation et sa mise à niveau.
En plus de ces avancements, Vue Storefront prévoit également de mettre à jour ses modules d’enregistrement à l’API afin de garantir le Lazy-Loading. En effet, le Lazy-Loading des modules est quasiment incontournable pour l’amélioration du confort utilisateur sur une application. Il permet de ne pas télécharger l’ensemble des modules de l’application d’un seul coup, en ne chargeant uniquement que ceux utilisés par la page sur laquelle l’utilisateur navigue. Il est important de préciser que ce changement n’affectera pas les fonctionnements internes des modules actuellement présents dans Vue Storefront, puisque vous pourrez continuer d’utiliser les nouvelles API sans avoir à y effectuer de modifications majeures.
La rétro-compatibilité de Vue Storefront 2.0 avec les anciennes versions :
Même si l’on assiste à un déplacement de la couche de la communication core<>theme vers les stores Vuex et à une déconnection des pages principales, ces dernières seront maintenues et adaptées aux nouvelles évolutions induites par la version 2.0, de façon à ce que les utilisateurs de l’ancien thème de Vue Storefront puissent toujours bénéficier des mises à jour de la solution. En effet, les E-Commerçants utilisant Vue Storefront au sein de leur plateforme de vente en ligne ne seront pas plus affectés par ces changements que par les mises à jour régulièrement effectuées par la PWA.
Vue Storefront met un point d’honneur à introduire de nouvelles API progressivement, étape par étape, afin que Vue Storefront 2.0 constitue l’apogée des améliorations apportées tout au long de l’année par la communauté et non pas un logiciel totalement nouveau, nécessitant un temps d’adaptation supplémentaire avant que ses utilisateurs ne puissent l’utiliser de façon optimale.
Theme 2.0 : le nouveau thème par défaut accompagnant Vue Storefront 2.0
Theme 2.0 sera basé sur Storefront UI, une bibliothèque personnalisable de composants d’interface utilisateur pour les développeurs, les designers et les agences souhaitant concevoir des vitrines E-Commerce de qualité. Établie sur Vue.js, Storefront UI est conçue par les équipes de Vue Storefront et dispose d’une documentation très complète que vous pouvez retrouver via ce lien pour obtenir davantage d’informations sur son fonctionnement.
L’objectif de Theme 2.0 est de fournir un outil “prêt à l’emploi”, rapide et puissant, en mettant l’accent sur la dimension Mobile-First. Afin d’assurer la meilleure expérience utilisateur possible, Theme 2.0 se base sur le Playbook Google UX for Retail, ce qui permet aux développeurs de personnaliser le design à leur souhait, tout en le gardant évolutif, contrairement au thème actuel de Vue Storefront.
Les objectifs que Vue Storefront souhaite atteindre via le Theme 2.0 :
- Une expérience dite “prête à l’emploi”
- Une structure simplifiée des thèmes présents
- Une documentation complète et détaillée
- Des composants 100 % Mobile-First
- Offrir la possibilité de personnaliser n’importe quel aspect de l’interface utilisateur sans perdre en évolutivité
- Une amélioration des performances
Conclusion
Vue Storefront 2.0 ainsi que le Theme 2.0 sortiront prochainement, mais la date n’est cependant pas encore fixée. Vous pouvez suivre les progrès sur le Github de VSF qui laisse sa porte grande ouverte aux contributeurs souhaitant apporter leur pierre à l’édifice (la communauté compte aujourd’hui plus de 120 contributeurs et 1200 développeurs impliqués !). Vue Storefront recommande de commencer tout les nouveaux projets sur la version 1.x. Après la sortie de VSF 1.11, un programme LTS (Long Term Support) sera lancé, tout en continuant de concentrer leurs ressources sur le développement 2.0 !
Grâce à ces sorties prometteuses, Vue Storefront se rapproche un peu plus de son objectif sur le long terme, qui est de devenir une référence dans les standards de l’industrie du E-Commerce : une ambition que nous partageons et qui nous motive à nous surpasser dans l’accompagnement de nos clients au quotidien.
Vous êtes intéressé par Vue Storefront ? N’hésitez pas à nous contacter pour bénéficier de notre expertise sur cette PWA dans vos projets E-Commerce !