Web Assembly, technologie du Web moderne ?

Qu’est ce que Web Assembly ?

Une extension JavaScript ?

A l’origine, c’est en effet l’effort d’optimisation du JavaScript ASM.js qui est un précurseur de WebAssembly. Cependant, WebAssembly ne se limite pas à de la programmation en JavaScript.

Une nouvelle JVM ?

L’optimisation de JavaScript conduit le groupe derrière WebAssembly à proposer une représentation source proche de l’assembleur. Comme la machine virtuelle Java (JVM) ou Point.Net (CLR), il existe donc bien une représentation intermédiaire, mais contrairement à ces deux cas, l’exécution ne requiert pas l’installation sur le poste client d’un composant exécutant le programme cible. C’est le navigateur qui effectue la traduction, et l’exécution est faite au plus proche du code natif propre au processeur de la machine du client.

Définition du site webassembly.org

Extrait du site webassembly.org :

WebAssembly (abrégé en Wasm) est un format d’instructions binaires pour une machine virtuelle à base de pile. Wasm est conçu comme une cible portable de la compilation de langages [de programmation] de haut niveau comme le C, C++, Rust, facilitant le déploiment sur le Web d’application côté client comme serveur.

Texte anglais d’origine : “WebAssembly (abbreviated Wasm) is a binary instruction format for a stack-based virtual machine. Wasm is designed as a portable target for compilation of high-level languages like C/C++/Rust, enabling deployment on the web for client and server applications.”

Chronologie d’une technologie récente

• Juin 2015 : annonce de WASM

  • Création du WebAssembly Community Group avec des représentants des équipes de développement des navigateurs web :
    • Chrome
    • Edge
    • Firefox
    • WebKit

• Mars 2017 : MVP de l’API WASM (fin des pré-versions expérimentales des navigateurs)

• Novembre 2017 : support de tous les navigateurs majeurs

• Mars 2019 : annonce de WASI (WebAssembly en dehors du navigateur)

• Décembre 2019 : publication de WASM Core 1.0

WebAssembly : Quels objectifs ?

Rapidité

La rapidité est l’un des points clés de WebAssembly :

• Code rapide à télécharger (nécessaire dans un environnement distribué comme le Web)
• Code rapide à l’exécution

Portabilité

Cette technologie orientée pour le Web, donc :

• Doit fonctionner quel que soit le Sytème d’Exploitation cible.
• Doit fonctionner quelle que soit la plateforme matérielle.

Lisibilité

La lisibilité du code doit favoriser la mise au point et les corrections.

Cet objectif reste à réaliser. Dans le fonctionnement actuel, la lisbilité du code repose sur le langage source. Les outils de déverminage (debugging) sont jusqu’à aujourd’hui manquants en termes de maturité.

Sécurité

Dans l’environnement du Web inter-connecté, les questions de sécurité sont tout de suite mises en avant :

• L’exécution ne doit pas diminuer les capacités de fonctionnement du navigateur.
• L’exécution ne doit pas mettre en danger le fonctionnement du Système d’Exploitation hôte.
• L’utilisation systématique d’une mécanique de « bac à sable » s’est donc imposée.

L’étape suivante : WASI

Une des limites de WebAssembly est l’impossibilité d’accéder aux ressources locales du client (notamment les fichiers), du fait de l’exécution dans le navigateur, pour raisons de sécurité.

WASI (WebAssembly System Interface) va permettre de s’affranchir de cette limite, en autorisant l’exécution en dehors du navigateur.

L’importance de WASI (qui reste en développement à l’heure actuelle) est soulignée par la citation suivante de Solomon Hykes, fondateur de Docker, société qui développe le produit très connu du même nom dans le domaine de la conteneurisation d’applications : « Si WASM et WASI avaient existé en 2008, nous n’aurions pas eu besoin de créer Docker ».

Cas d’utilisation de WebAssembly

Dans le navigateur

Quelques domaines d’utilisation de WebAssembly :

• Vision par ordinateur
• Manipulation d’image / de vidéo
• Jeux vidéos
• Réalité virtuelle / augmentée
• Emulation matérielle
• Cryptage

De façon générale, toute application consommatrice de ressource processeur, de calculs intensifs est concernée.

En dehors du navigateur

• Jeux vidéos
• Exécution de code non vérifié côté serveur
• Application côté serveur
• Applications mobiles hybrides (application mobile liée à un ou plusieurs serveurs)

Comment utiliser WebAssembly ?

WebAssembly est une technologie destinée aux développeurs. Cette partie présente de façon illustrée, par un exemple très simple, les principes d’utilisation simplifiée des outils actuels.

Schéma général

Voici le schéma de fonctionnement général présenté par la fondation Mozilla qui mène le développement du navigateur Firefox :

Les formats source

WebAssembly n’a pas été prévu pour être programmé directement, mais plutôt comme du code intermédiaire proche des instructions de base des processeurs. Le programmeur dispose donc du code source dans le langage de haut niveau (C, C++ ou Rust), que le compilateur transforme en un code binaire ou texte Wasm très proche de l’assembleur, et c’est ensuite le navigateur qui traduit en code machine pour le processeur dans son bac à sable WebAssembly.

Voici une comparaison des différentes versions d’un programme écrit en C lors du passage par WebAssembly.

Un exemple simple : Hello Cantor World !

Utilisation de emscripten

Le principal kit de développement en WebAssembly est Emscripten. Il est librement téléchargeable et installable en ligne sur le site et utilisable immédiatement. L’architecture du kit est proche des kits traditionnels de développement en ligne de commande des langages sources supportés (C, C++, Rust).

Hello : le programme en C

L’écriture du code source est faite en langage C. Il s’agit d’une simple ligne d’affichage de la chaîne de caractères « Hello, Cantor World ! », exécuté à l’aide d’une des primitives classiques de la bibliothèque d’entrée-sortie du langage.

Hello : fichier intermédiaire HTML

Le programme se compile exactement de la même manière que pour un programme C habituel, mais les fichiers intermédiaires produits sont différents. On obtient des fichiers javascript, html et finalement wasm. Le code WebAssembly proprement dit est produit dans le fichier wasm, les deux autres fichiers servant d’intermédiaire pour permettre son intégration dans une page web classique, accessible par le navigateur.

Hello : service du programme

Pour accéder au programme obtenu, un serveur de fichier est nécessaire (il s’agit généralement d’un serveur Web comme Apache ou d’applications javascript comme node.js). En effet, pour des raisons de sécurité, le navigateur ne permet pas l’interprétation d’un fichier de source « inconnue », même disponible localement sur la machine cliente. Le kit de développement facilite le test avec un utilitaire (emrun) inclus pour jouer le rôle de serveur simplifié des fichiers de développement locaux.

Hello : exécution dans Firefox

Le navigateur internet (Chrome ou Firefox, ou Safari) peut maintenant accéder à l’application et l’exécuter dans son bac à sable de manière transparente, comme s’il la téléchargeait à partir d’un site Web classique.

Hello : fichiers sources WebAssembly

Source HTML

Le fichier source HTML ne sert en fait qu’à encapsuler le logo de emscripten et à inclure le fichier javascript.

Source JS

Le fichier source JS sert à inclure le fichier wasm et à fournir l’interface de chargement du code WebAssembly inclus dans ce dernier fichier.

Source binaire Wasm

Le fichier wasm obtenu par la compilation est complètement binaire et ne permet pas un affichage intelligible.

Conversion binaire vers texte Wasm

Il est possible d’obtenir aussi le fichier wasm dans un format texte « intelligible » en convertissant la version binaire. Le kit de développement contient des utilitaires qui permettent de passer d’un format à l’autre.

Source du binaire Wasm en texte

Le fichier wasm obtenu par conversion est affichable en texte, comme du code source habituel. Cependant, les instructions restent très proches de l’assembleur des processeurs, et donc moins compréhensible que le code source C d’origine.

Hello : exécution avec WASI

Le kit de développement WASI est encore en phase préliminaire et n’est pas disponible directement pour Windows. On peut cependant l’utiliser sous Windows avec la couche Windows Services pour Linux, dans un Linux hébergé de cette façon. Le kit est librement téléchargeable et installable.

Voici l’exécution de notre programme avec l’exécuteur en temps réel de WASI, wasmtime.

Exemples d’applications actuelles

WebAssembly n’est pas qu’un format pour développeur à la pointe du progrès. Il existe déjà des applications distribuées de cette manière par des éditeurs logiciels de premier plan.

• AutoCAD : https://web.autocad.com
• Google Earth Web : https://earth.google.com/web/

Voici les bureaux de Cantor visibles dans la version Web de GoogleEarth, distribuée notamment en WebAssembly :

Conclusion

WebAssemly est une technologie à suivre, par ses capacités de migrer des applications d’envergure vers un format très adapté au déploiement sur le Web. Nul doute qu’elle va se répandre de façon considérable dans le monde applicatif distribué.