WASM, WASI, WTF? .NET developer‘s WebAssembly 101 Christian Weyer

§ Cloud-native & serverless architectures § Pragmatic end-to-end solutions § Mobile & web-based application architectures § Microsoft Regional Director § Microsoft MVP for Developer Technologies & Azure ASPInsider, AzureInsider § Google GDE for Web Technologies [email protected] @christianweyer https://www.thinktecture.com WASM, WASI, WTF? .NET developer's WebAssembly 101 Christian Weyer Co-Founder & CTO @ Thinktecture AG 2

§ Intro § Web § Compute § .NET § Wrap-up WASM, WASI, WTF? .NET developer's WebAssembly 101 Agenda 3

WASM, WASI, WTF? .NET developer's WebAssembly 101 Intro 4

WebAssembly (Wasm) is a § secure § fast § portable stack-based execution environment (aka virtual machine), for running applications by executing low-level sandboxed bytecode. WASM, WASI, WTF? .NET developer's WebAssembly 101 What is WebAssembly? 5

Server Server WASM, WASI, WTF? .NET developer's WebAssembly 101 Why WebAssembly? Everything, everywhere – securely 6 Origins Current developments Future Web Web Web Cloud Cloud Microcontroller Extensibility Extensibility Bare metal Edge

WASM, WASI, WTF? .NET developer's WebAssembly 101 Web 7

§ The browser evolved to a smart client application platform § Browser APIs (file system access, clipboard, sharing data etc.) § Runs on (almost) every platform § Handling updates is easy (and cheap) § Download new version from the server WASM, WASI, WTF? .NET developer's WebAssembly 101 Web as a platform for ubiquitous client applications 8

§ Native code - fast, efficient, and portable § Low-level bytecode for the web § No plugins needed § Standards and specifications through W3C § Uses existing browser sandbox features § Use native code to run inside the browser, in a secure environment § Interoperability via JavaScript for accessing browser APIs WASM, WASI, WTF? .NET developer's WebAssembly 101 WebAssembly in the browser 9

1. Migrate native code (like desktop applications) to the web 2. Augment or speed up web applications WASM, WASI, WTF? .NET developer's WebAssembly 101 Major scenarios for WebAssembly in the browser 10

WASM, WASI, WTF? .NET developer's WebAssembly 101 Migrating native code to the browser (large C++ codebase) 11

§ Video games § Music streaming § Video editing § 3D rendering § Encryption § Image recognition / processing § Running simulations WASM, WASI, WTF? .NET developer's WebAssembly 101 Calculation-intensive use cases 12

Offline Web-based AI with LLMs, WebGPU & Wasm WASM, WASI, WTF? .NET developer's WebAssembly 101 DEMO 13

WASM, WASI, WTF? .NET developer's WebAssembly 101 Compute 14

§ Size § Compared to other distributables (containers | VMs), Wasm is super small § Speed § Wasm modules are bootstrapped in “no time” and are fast at runtime § Resource utilization § With same compute power, more applications can be executed § Security § Wasm modules are isolated and every module can have dedicated permissions WASM, WASI, WTF? .NET developer's WebAssembly 101 WebAssembly outside the browser – ubiquitous compute 15

§ Enabling Wasm in a Cloud-native world § WASI (WebAssembly System Interface) provides standardized system calls to sandboxed Wasm code § WASI offers capability-based isolation § WASI is platform-agnostic: run Wasm applications on any WASI-compliant platform (device, OS, CPU arch) § WASI offers containerization on the next level WASM, WASI, WTF? .NET developer's WebAssembly 101 WASI 16 https://twitter.com/solomonstre/status/1111004913222324225

§ Host infrastructure for executing Wasm applications leveraging APIs specified and provided by WASI § Handle system calls made by Wasm modules and delegate them to the underlying platform, e.g.: § File access § Network access § Environment variables § WASI runtime examples § wasmtime § wasmer § WebAssembly Micro Runtime (WAMR) WASM, WASI, WTF? .NET developer's WebAssembly 101 WASI runtimes 17

§ No infrastructure management § Speed of Wasm allows scale-down to 0 § No impact on request performance § Notable Serverless Wasm platforms today § Fermyon § Spin & Fermyon Cloud § Microsoft is experimenting in Azure § Currently in AKS - not really serverless, yet WASM, WASI, WTF? .NET developer's WebAssembly 101 Serverless WebAssembly with WASI 18

Serverless HTTP API with Spin & Wasm WASM, WASI, WTF? .NET developer's WebAssembly 101 DEMO 19

WASM, WASI, WTF? .NET developer's WebAssembly 101 .NET 20

§ .NET went live in 2002 § Desktop and single servers were dominating § .NET wants and needs to be ready for modern distributed Cloud-native software solutions § Original .NET Core was one step into that direction § .NET has different runtime form factors § Including WebAssembly – for ubiquitous execution WASM, WASI, WTF? .NET developer's WebAssembly 101 .NET in 2023 21

§ .NET’s current Wasm support builds on Mono § Relies on emscripten § Creates .NET assemblies & interprets them on .NET runtime compiled to Wasm § AOT mode enables ahead-of-time compilation § .NET-compiled Wasm & JS interop § Take your C# / .NET code into the browser § Integrate it with any JS code in the browser, e.g. JS SPA frameworks § Blazor WebAssembly § Build C#- / .NET-based SPAs with Razor components WASM, WASI, WTF? .NET developer's WebAssembly 101 .NET & WebAssembly - browser 22

Blazor WebAssembly - File – New – Project… WASM, WASI, WTF? .NET developer's WebAssembly 101 DEMO 23

§ .NET team recognizes the need for first-class citizen support for Wasm & WASI § .NET WASI SDK § Relies on LLVM § Produces one single .wasm file § Experimental – being evolved & stabilized towards .NET 8 release § .NET NativeAOT-LLVM § NativeAOT can make .NET binaries smaller & faster § Future Wasm support could be based on NativeAOT, in addition to Mono - very experimental today WASM, WASI, WTF? .NET developer's WebAssembly 101 .NET & WebAssembly – beyond the browser 24

.NET WASI SDK § Hello Console app § ASP.NET Core app § Spin with .NET WASM, WASI, WTF? .NET developer's WebAssembly 101 DEMO 25

WASM, WASI, WTF? .NET developer's WebAssembly 101 Wrap-Up 26

§ Secure, fast, portable “write once, run anywhere” § A compiler target, in the end § Also for .NET developers § A lot of things are still moving, though § Specifications & standards § Technologies § Developer tooling § .NET embraces Wasm & WASI – make yourself familiar today & think about possibilities WASM, WASI, WTF? .NET developer's WebAssembly 101 Wasm & WASI will be big for ubiquitous computing 🙌 27 Server Future Web Cloud Microcontroller Extensibility Bare metal Edge

WASM, WASI, WTF? .NET developer's WebAssembly 101 … one more thing … 28

Thank you! Christian Weyer https://thinktecture.com/christian-weyer Demos: https://github.com/thinktecture-labs/dotnet-wasi-samples 29

§ CanIUse.com § https://caniuse.com/?search=WebAssembly § Web-LLM § https://mlc.ai/web-llm/ § WASI § https://wasi.dev/ § Fermyon Spin § https://www.fermyon.com/spin § .NET Form Factors § https://github.com/dotnet/designs/blob/main/accepted/2020/form-factors.md#webassembly § .NET WASI SDK § https://github.com/dotnet/dotnet-wasi-sdk § Wasmtime .NET § https://github.com/bytecodealliance/wasmtime-dotnet § Extism § https://github.com/extism/extism § Specifications, Standards § https://github.com/WebAssembly/proposals § https://webassembly.org/roadmap/ § https://github.com/WebAssembly/WASI/blob/main/Proposals.md WASM, WASI, WTF? .NET developer's WebAssembly 101 Links 30