Tech Workshop: Mercure by Kevin Dunglas at SensioLabs

On Wednesday, January 16th, we welcomed Kevin Dunglas in our Clichy headquarters. Kevin is a Symfony Core Team member & creator of API-Platform: he presented us Mercure, his new Open-Source project providing very useful features to update live your data from an app.

Mercure, like the ancient god responsible for messengers and well-known for its speed: nice name for a protocol notifying almost instantaneously data updates, while consuming few resources.

mercure-god

Mercure is a protocol and a reference implementation (currently under validation as a standard approved by the IETF). With Mercure, you can now partially replace Websocket, which is not compatible with HTTP/2 and HTTP/3.

Another great benefit: you can use directly Mercure in all programming languages including those, which are not able to maintain persistent connections, like PHP.

Mercure turns out to be very useful because it is written in Go. Like Node.JS, you can use this technology to maintain persistent connections or in order to work serverless.

Among many use cases that Mercure enables to push data from server to client, you can find:

  • Notification (live management of changes on uploaded document);
  • User Interface synch;
  • The ability to use HTTP to provide coordination between the ServiceWorker and the user.

And much more … 😊

Last month at Lisbon Symfony Con, Kevin gave a memorable public demonstration of Mercure.

2 devices were connected on the same web page. Thanks to Mercure, Kevin dispatched the information to all other devices, an action that is often difficult to realize with Symfony.

démo-mercure

Live demo using Mercure

To execute these functions, some protocols already exist, but they have their own drawbacks: for instance “polling”, SSE, Websocket, Web Push. WebSub adds the concept of hub that Mercure also uses, but you can’t get it working in a navigator.

The release of HTTP/2 has enabled developers to create as many connections as you wish. So, thanks to “multiplexing”, you can create a “full duplex” protocol: Mercure (available on Github here).

workshop-mercure-sensiolabs

During this practical workshop we have tested Mercure, which is very easy to handle. It was broadcasted live for our remote colleagues, who were able to participate from home. Here is an example of a project realized on Github during the workshop.

Technically, we have done simple things and it was even easier thanks to a very simple implementation and to the native integration to ApiPlatform: good news!

We were able to develop a hub to better understand it works. Then, we have created a Symfony + ApiPlatform project, and a small script in JavaScript as well. The aim was to receive notifications on our web page when an article is introduced into database from another client (mobile phone, another navigator, etc.).

It’s a common use case, but it leads to more advanced features such as live refreshing of very precise parts of pages, or many other features you can imagine 😉

We extended this amazing workshop enjoying together tasty kebabs & pizzas 🍕😋

You can find Mercure on Github and here is the link to find out the documentation.

Kevin will talk about Mercure with much more details at Symfony Live Lille on March, 1st. If you speak French, don’t miss it!

SymfonyLive Lille

Thanks Kevin for coming to Clichy and sharing with us many insights. Come back any time you want 😊