Tech Workshop Mercure par Kévin Dunglas à SensioLabs

Kévin Dunglas, membre de la Core Team Symfony et créateur d’API Platform, était mercredi 16 janvier dans nos locaux à Clichy pour nous présenter Mercure, son nouveau bébé Open-Source aux fonctionnalités bien pratiques pour mettre à jour les données d’une application en temps-réel.

Mercure, comme le Dieu antique responsable du courrier et des messages, célèbre pour sa rapidité : un nom bien trouvé pour un protocole qui permet de notifier presque instantanément les mises à jour des données, en économisant en même temps sa consommation de ressources.

mercure-god

Mercure est un protocole et une implémentation de référence (en cours de validation en tant que standard auprès de l’IETF). Il permet de remplacer partiellement Websocket, qui n’est pas compatible avec HTTP/2 et HTTP/3.

Un autre avantage de cet outil est qu’il peut être utilisé directement dans tous les langages de programmation y compris ceux qui ne sont pas capables de maintenir des connexions persistantes comme c’est le cas avec PHP.

Mercure peut s’avérer aussi très pratique car il est écrit en Go, une technologie capable, comme Node.JS, de maintenir des connexions persistantes ou de travailler en mode “serverless”.

Parmi les nombreux cas d’usage permis par Mercure pour pousser des données du serveur vers le client, on retrouve :

  • La notification (gestion en temps réel des changements sur le document chargé) ;
  • La synchronisation d’UI (Interface Utilisateur) ;
  • La possibilité d’utiliser HTTP pour assurer la coordination avec le ServiceWorker et l’utilisateur.

Et bien d’autres … 😊

Kévin a fait une démonstration marquante de Mercure à la SymfonyCon de Lisbonne le mois dernier.

Deux terminaux étaient connectés à la même page web. Mercure a permis de dispatcher l’information à tous les autres terminaux, ce qui est souvent difficile à faire avec Symfony.

démo-mercure

Vidéo démo live d’une utilisation de Mercure

Pour réaliser ces fonctions, plusieurs protocoles existent déjà, mais avec chacun des désavantages :  le “polling”, les SSE, Websocket, Web Push. WebSub introduit la notion de hub, utilisée par Mercure, mais il est impossible de le faire fonctionner dans un navigateur

L’arrivée de HTTP/2 a permis de créer autant de connexions qu’on veut. Grâce au “multiplexing”, on peut ainsi créer un protocole qui va être “full duplex” : Mercure.

workshop-mercure-sensiolabs

Nous avons pu tester Mercure, très facile à prendre en main, au cours d’une démonstration pratique en live, et rediffusée pour nos collègues à distance. Voici un exemple du projet réalisé sur Github pendant le workshop.

Techniquement, ce que nous avons accompli est assez simple, mais la facilité d’implémentation et l’intégration native avec ApiPlatform est une très bonne nouvelle !

Nous avons pu lancer un hub et comprendre ses paramètres et son fonctionnement, puis nous avons créé un projet Symfony + ApiPlatform accompagné d’un petit script en JavaScript. Le but était de pouvoir recevoir une notification sur notre page web lorsqu’un article était inséré en base de données depuis un autre client (un téléphone mobile, un autre navigateur, etc.).

C’est un cas d’usage répandu, mais il mène à d’autres fonctionnalités bien plus avancées comme le rafraîchissement en direct de portions de pages très précises, ou d’autres fonctionnalités que vous pouvez imaginer 😉

Celles et ceux qui sont restés jusqu’au bout ont prolongé le workshop autour de délicieuses pizzas 🍕😋

Retrouvez Mercure sur Github et voici le lien vers sa documentation.

Kévin fera une présentation détaillée de Mercure au Symfony Live de Lille le 1er mars, ne la ratez pas !

symfonylive-lille

Merci Kévin d’être venu nous expliquer Mercure et reviens nous voir quand tu veux 😊