Accès rapide :
La plateforme complète de services et de solutions de Synolia pout délivrer la meilleure expérience.
Voir toutes nos expertises
Les experts de Synolia vous accompagnent tout au long de votre projet avec des services adaptés à vos besoins.
Voir tous nos services
Des solutions qui s’adaptent à vos besoins pour servir votre stratégie de digitalisation.
Voir toutes nos solutions
[chapo]En Septembre dernier, Pascal Brunel publiait un article présageant un avenir prospère aux Progressive Web Apps (PWA). Près d’un an après, vous vous demandez peut être où en est le sujet, et surtout où en est la solution proposée par notre partenaire Magento. Nos experts vous répondent.[/chapo]
Rappelons le contexte :
Ces dernières années, la croissance exponentielle des utilisateurs de téléphone portable à travers le monde a explosé, à tel point qu’aujourd’hui, plus de 63% de l’utilisation totale d’internet se fait depuis un téléphone. Le nombre d’utilisateurs de téléphone portable devrait atteindre 2,87 milliard en 2020. Cette tendance montre qu’il est capital de mettre l’accent sur l’optimisation de l’expérience utilisateur sur mobile.
Côté utilisateurs, si ces derniers se sentent de plus en plus à l’aise avec le fait d’acheter via leur mobile, une vaste majorité déclare fuir une application mal conçue, difficile à utiliser ou trop lente.
Une PWA (pour Progressive Web Application) est une application web qui intègre des pratiques propres au développement web moderne et des fonctionnalités jusque là réservées aux applications natives sur mobile, celles que l’on télécharge depuis l’AppStore ou le PlayStore.
Par exemple, si vous utilisez l’application Facebook, vous savez que vous pouvez l’utiliser hors-ligne et avoir quand même accès à du contenu. Vous pouvez même liker et commenter les photos de chats de votre grand-mère et lorsque vous récupérerez la connexion vos actions seront transmises automatiquement en tâche de fond.
La promesse de la PWA est la suivante : proposer une expérience au moins équivalente à une application native, sans avoir à la télécharger ni à l’entretenir avec des mises à jour.
Une PWA propose une série de fonctionnalités qui manquent en général aux applications web classiques.
Il y a quelques mois, Magento a annoncé son intention de donner la possibilité aux développeurs de créer des storefront PWA sur leurs sites Magento ( >= 2.3) en mettant à leur disposition une boîte à outils : PWA Studio.
Actuellement, PWA Studio contient trois entités distinctes :
Si la question que l’on se pose est de savoir si la solution de PWA de Magento est prête pour la production, on peut analyser les fonctionnalités e-commerce qui sont disponibles aujourd’hui sur PWA Studio. D’après ce que Magento communique sur la roadmap de ce projet on peut établir la liste suivante :
En 2018, Magento avait pour but de délivrer le plus de contenus possible sur sa preuve de concept, le storefront Venia. On pourrait penser que Magento ferait de Venia un nouveau thème générique tel que Luma – qui servirait de base et serait étendu par d’autre thèmes personnalisés comme c’était le cas jusqu’ici pour le développement frontend sur cette plateforme – mais ce n’est pas le cas ! Pour le comprendre, il faut bien saisir la distinction que fait Magento entre thème et storefront.
Le thème est la partie de Magento qui définit l’aspect du site. Il fait partie de son fonctionnement interne et ses fonctionnalités sont profondément liées au coeur de l’application. Un thème Magento hérite toujours d’un thème parent pour étendre ses fonctionnalité, avec au sommet de la chaîne d’héritage le thème Blank qui fournit une base de fichiers qui seront étendus, écrasés et customisés par les développeurs pour construire leurs thèmes.
Un storefront tel que Venia n’est pas un thème Magento. C’est une PWA, une application à part entière qui communique avec un backend Magento “headless”. Le storefront n’hérite pas d’un thème, il est composé de modules React qui prodiguent les différentes fonctionnalités. Ces modules peuvent être échangés, ajoutés et supprimés pour composer l’application.
Ce sont deux approches différentes concernant la réutilisation de code.
L’avantage de l’héritage, c’est que le thème dispose dès le départ de toutes les fonctionnalités de son thème parent. Mais l’inconvénient c’est qu’il est couplé de façon très étroite avec toute sa chaîne d’héritage. Cela signifie qu’une mise à jour ou un changement de comportement de la part d’un thème parent peut entraîner des dégâts inattendus sur toute sa descendance.
L’approche modulaire pousse le développeur à construire son storefront à partir de rien, grâce à des modules React qu’il pourra assembler de façon plus flexible. L’indépendance des modules les uns par rapport aux autres leur permet de ne pas être autant exposés à des effets secondaires lors de mises à jour. L’idée est aussi de permettre aux développeurs de pouvoir réutiliser des modules très facilement d’un storefront à l’autre.
Si l’on regarde la roadmap de Magento, on peut voir que le but de l’éditeur à court terme n’est plus de créer un storefront totalement fonctionnel mais bien de constituer une bibliothèque de modules React (Peregrine) aussi complète que possible pour que les développeurs aient à leur disposition tous les outils dont ils ont besoin pour créer eux même leur storefront.
On peut observer dans l’évolution du projet une pause temporaire dans le développement de Venia au profit de Peregrine. Les travaux actuels consistent à faire la migration de toutes les fonctionnalités dont dispose Venia pour les traduire en module de Peregrine, constituer et enrichir une base de composants solide et les réintégrer ensuite sur Venia sous cette forme.
Enfin, un point crucial à considérer pour envisager le démarrage de projets en PWA sur Magento est la stack technique requise par les développeurs.
L’écart est assez grand, les différences de paradigmes (héritage/modularité) et de stack de technologies demandent de la part des développeurs frontend un tout nouvel ensemble de compétences.
Alors, le PWA Studio est-il prêt ?
Venia dispose, pour l’instant, des fonctionnalités de base d’un frontend Magento : fiches produit, catégories, panier, compte client, tunnel de paiement, recherche, etc. Cette preuve de concept a déjà accompli son but à court terme. Magento a visiblement l’intention de mettre l’accent sur Peregrine, sa bibliothèque de modules React. Elle est encore loin d’être complète mais d’après les travaux en cours sur le projet il est clair que c’est la nouvelle priorité.
Verdict : avec une équipe efficace en React il est possible aujourd’hui de lancer le développement d’une PWA.
Quelques points sont à prendre en compte tout de même. L’abandon de l’approche par héritage au profit de l’approche modulaire promet certes des gains de productivité, mais ce uniquement à moyen et long terme. En effet, il faudra bien que les modules personnalisés soient développés une première fois avant d’être réutilisés, et les premiers projets devront intégrer dans leurs temps de développement la mise au point de ces modules.
Il sera quoi qu’il en soit nécessaire de développer certaines fonctionnalités d’e-commerce qui manquent encore à Peregrine, la collection de modules livrée avec PWA Studio. De surcroît, il faudra composer avec l’instabilité d’une solution en plein développement.
La solution PWA Studio est donc encore incomplète mais déjà utilisable, et il est clair que Magento prend les enjeux de la PWA très au sérieux donc son évolution paraît très prometteuse.