Si je vous demande quels sont les langages que peut interpréter nativement un navigateur web, il y a de fortes chances pour que vous me répondiez : HTML, CSS et Javascript.

Et vous avez raison !

Mais si je vous disais qu’il existe aussi un moyen pour exécuter du code écrit en C/C++ ou même Python directement dans le navigateur ? Et bien oui, c’est possible grâce à une technologie que l’on appelle le Web Assembly.

Qu’est-ce que c’est ?

Le Web Assembly (ou WASM) est un format de bytecode spécialement fait pour être chargé, compilé et exécuté dans un navigateur.

Un bytecode est un langage intermédiaire entre un code non-compilé (écrit par le développeur), et un code machine (exécutable).

Le principe de Web Assembly est donc de prendre un code écrit avec un langage bas-niveau en entrée, pour le compiler en un bytecode qui sera chargé dans le navigateur avec une interface disponible pour que le Javascript et le code natif puisse communiquer facilement.

Une fois le bytecode chargé, il sera donc compilé en langage machine et exécuté dans une sandbox spécialisée du navigateur web.

Vous l’aurez compris, le principal intérêt du Web Assembly se cache dans sa vitesse d’exécution car il est désormais possible d’apporter la rapidité d’exécution des langages bas-niveau directement dans une application web.

Dans certains cas, on arrive même à des gains de performances jusqu’à 16 fois meilleurs que la vitesse d’exécution du même code en Javascript.

Pour ceux que ça intéresse, voilà un benchmark détaillé des performances entre Javascript et Web Assembly : https://link.medium.com/94HhoIRUZ9

Quels sont les usages du Web Assembly ?

La vitesse d'exécution et l'optimisation mémoire possibles grâce aux outils bas-niveau permettent de faire passer les applications web déjà très puissantes à un stade supérieur.

Il est désormais possible de développer des jeux de plus en plus complexes tournant directement dans le navigateur, c'est notamment le cas avec Unity qui exporte la version navigateur de ses jeux en Web Assembly.

Mais il est également possible de faire du Edge Computing, c'est à dire de soulager les serveurs en effectuant certains calculs sur la machine du client. C'est le cas par exemple pour certains hébergeur d'images qui effectuent la compression des images uploadées directement dans le navigateur.

Et avec le Web Assembly, même la compression vidéo dans le navigateur devient possible !

Et même si cette technologie est capable de bien d'autre choses (même miner de la blockchain), il ne faut pas oublier que pour certaines entreprise cela veut aussi dire pouvoir réutiliser une "legacy codebase" écrite en C dans un navigateur sans avoir à réécrire de JavaScript !

Comment l’utiliser ?

Si vous voulez mettre en place des modules Web Assembly, je vous recommande de lire ces deux tutoriels pour apprendre à installer et utiliser Emscripten, la toolchain nécessaire pour compiler des scripts C/C++ en Web Assembly :

J'espère que cet article vous aura plu, et je vous dis à bientôt sur le blog !

À propos de l'auteur

Hello, je suis Nicolas Brondin-Bernard, ingénieur web indépendant depuis 2015 passionné par le partage de d'expériences et de connaissances.

Aujourd'hui je suis aussi coach pour développeurs web juniors, tu peux me contacter sur nicolas@brondin.com, sur mon site ou devenir membre de ma newsletter pour ne jamais louper le meilleur article de la semaine et être tenu au courant de mes projets !


Photo par Hello I'm Nik 🎞 sur Unsplash