Travailler avec WebAssembly et C# : de A à Z dans .NET

Formateur Python en ligne pour débutants

Apprenez Python facilement sans surcharge théorique. Résolvez des tâches pratiques avec vérification automatique et écrivez du code directement dans le navigateur.

Start Course

Introduction : pourquoi WebAssembly change la donne pour les développeurs C#

\n\n

Pendant longtemps, le développement web a été le monopole de JavaScript. Cependant, avec l'arrivée de WebAssembly (Wasm), la situation a radicalement changé. Désormais, les développeurs C# peuvent compiler leur code dans un format binaire qui s'exécute dans le navigateur avec une vitesse quasi native. Cela ouvre d'immenses possibilités : du portage d'algorithmes lourds à la création d'applications SPA complètes avec Blazor.

\n\n

Dans cet article, nous allons voir comment WebAssembly fonctionne avec C# et .NET, examiner les outils clés (Blazor, Wasmtime, Mono) et écrire des exemples pratiques. À la fin, vous serez capable d'exécuter vous-même du code C# dans le navigateur ou sur un serveur avec Wasm.

\n\n

Fondamentaux de WebAssembly et son intégration avec C#

\n\n

Qu'est-ce que WebAssembly en termes simples

\n\n

WebAssembly est un bytecode bas niveau qui s'exécute dans une machine virtuelle du navigateur. Il ne remplace pas JavaScript, mais fonctionne avec lui. Les principaux avantages :

\n
    \n
  • Performance : le code binaire s'exécute 30 à 50 % plus vite que le JS.
  • \n
  • Sécurité : environnement d'exécution isolé.
  • \n
  • Portabilité : un même fichier .wasm fonctionne dans Chrome, Firefox, Safari et Edge.
  • \n
\n\n

Pour C#, l'écosystème WebAssembly est implémenté via plusieurs projets : Blazor WebAssembly (framework pour l'interface utilisateur), Mono Wasm Runtime (exécute le code IL) et Wasmtime (pour les scénarios serveur).

\n\n

Comment C# est compilé en WebAssembly

\n\n

Le processus se déroule ainsi :

\n
    \n
  1. Vous écrivez du code en C#.
  2. \n
  3. Le compilateur Roslyn le transforme en IL (langage intermédiaire).
  4. \n
  5. Mono Runtime (ou NativeAOT) traduit l'IL en WebAssembly.
  6. \n
  7. Le navigateur charge le fichier .wasm et l'exécute.
  8. \n
\n\n

Important : il existe deux approches — l'interprétation via Mono (plus lente, mais plus simple) et la compilation AOT (plus rapide, mais nécessite une configuration).

\n\n

Pratique : trois façons d'exécuter C# dans WebAssembly

\n\n

1. Blazor WebAssembly — pour les interfaces web

\n\n

Blazor permet d'écrire la partie cliente en C# au lieu de JavaScript. Tout le code UI et la logique métier sont compilés en Wasm.

\n\n

Exemple d'un composant simple :

\n
@page "/counter"\n<h3>Compteur : @currentCount</h3>\n<button @onclick="IncrementCount">+1</button>\n\n@code {\n    private int currentCount = 0;\n\n    private void IncrementCount()\n    {\n        currentCount++;\n    }\n}
\n\n

Ce code s'exécute dans le navigateur. Blazor charge automatiquement Mono Wasm Runtime et votre fichier .wasm. Pour démarrer, créez un projet :

\n
dotnet new blazorwasm -o MyBlazorApp\ncd MyBlazorApp\ndotnet run
\n\n

Résultat : une application SPA complète sans une seule ligne de JavaScript.

\n\n

2. Compilation directe en .wasm avec NativeAOT

\n\n

Si vous devez exécuter une fonction spécifique (pas d'UI), utilisez NativeAOT — il compile le C# directement en WebAssembly natif sans Mono Runtime.

\n\n

Étapes :

\n
    \n
  1. Installez le SDK .NET 8+ et le workload : dotnet workload install wasm-tools
  2. \n
  3. Créez une application console :
  4. \n
\n\n
dotnet new console -n WasmDemo\ncd WasmDemo
\n\n
    \n
  1. Modifiez le fichier .csproj en ajoutant le support Wasm :
  2. \n
\n\n
<PropertyGroup>\n    <OutputType>Exe</OutputType>\n    <TargetFramework>net8.0</TargetFramework>\n    <RuntimeIdentifier>browser-wasm</RuntimeIdentifier>\n    <UseNativeAot>true</UseNativeAot>\n</PropertyGroup>
\n\n
    \n
  1. Écrivez le code :
  2. \n
\n\n
using System;\n\npublic class Program\n{\n    public static void Main()\n    {\n                

Blogs

Book Recommendations