Travailler avec WebAssembly et Java : exécuter du code Java dans le navigateur

Introduction : Pourquoi Java dans WebAssembly ?

WebAssembly (WASM) est un format d'instructions binaires de bas niveau conçu pour être exécuté dans le navigateur avec des performances proches du natif. Pendant longtemps, Java est resté en dehors de cet écosystème en raison de sa machine virtuelle (JVM). Cependant, des outils modernes comme TeaVM et CheerpJ permettent de compiler du code Java en WebAssembly, ouvrant ainsi de nouvelles possibilités pour le développement web.

Dans cet article, nous analyserons comment fonctionne la combinaison Java + WebAssembly, examinerons des exemples pratiques et évaluerons les performances. Vous apprendrez à porter du code Java existant dans le navigateur sans le réécrire en JavaScript.

Principales Approches pour Intégrer Java et WebAssembly

Il existe deux manières principales d'exécuter du code Java dans WebAssembly :

• Compiler le bytecode en WASM — utilise TeaVM, qui traduit le bytecode Java en WebAssembly.
• Exécuter la JVM dans le navigateur — CheerpJ émule la JVM dans WebAssembly, permettant d'exécuter des applications Java non modifiées.

La première approche est préférable pour les nouveaux projets, car elle donne une taille de paquet plus petite et de meilleures performances. La seconde est adaptée au portage d'applications legacy.

Configuration d'un Projet avec TeaVM

Pour commencer avec TeaVM, ajoutez la dépendance à pom.xml (Maven) :

<dependency>    <groupId>org.teavm</groupId>    <artifactId>teavm-classlib</artifactId>    <version>0.9.0</version></dependency>

Créez une classe Java simple pour la compilation :

import org.teavm.jso.JSBody;import org.teavm.jso.JSExport;

public class Calculator {        @JSExport    public static int add(int a, int b) {        return a + b;    }        @JSExport    public static int factorial(int n) {        if (n <= 1) return 1;        return n * factorial(n - 1);    }}

L'annotation @JSExport rend les méthodes accessibles depuis JavaScript. Après la compilation, vous obtiendrez un module WASM et un wrapper JavaScript.

Exemple Pratique : Compilation et Appel depuis JavaScript

Examinons le cycle complet, de la compilation à l'appel dans le navigateur. Commencez par compiler le code Java en utilisant le plugin TeaVM :

<plugin>    <groupId>org.teavm</groupId>    <artifactId>teavm-maven-plugin</artifactId>    <version>0.9.0</version>    <configuration>        <targetType>WEBASSEMBLY</targetType>        <mainClass>com.example.Calculator</mainClass>    </configuration>    <executions>        <execution>            <goals>                <goal>compile</goal>            </goals>        </execution>    </executions></plugin>

Après la construction (mvn package), les fichiers calculator.wasm et calculator.js apparaîtront dans le dossier target. Créez maintenant une page HTML :

<!DOCTYPE html><html><head>    <title>Démo Java + WebAssembly</title></head><body>    <h1>Calculatrice Java en WASM</h1>    <p>Résultat : <span id="result"></span></p>        <script src="calculator.js"></script>    <script>        // Fonction de rappel après le chargement du WASM        teavmMain().then(function(api) {            var sum = api.com.example.Calculator.add(15, 27);            var fact = api.com.example.Calculator.factorial(5);            document.getElementById('result').innerHTML =                 '15 + 27 = ' + sum + '<br>' +                '5! = ' + fact;        });    </script></body></html>

Ouvrez la page