WASM, WASI, WTF? WebAssembly 101 – for .NET developers Christian Weyer @christianweyer CTO, Technology Catalyst

§ Technology catalyst § AI-powered solutions § Pragmatic end-to-end architectures § Microsoft Regional Director § Microsoft MVP for Developer Technologies & Azure ASPInsider, AzureInsider § Google GDE for Web Technologies christian.weyer@thinktecture.com @christianweyer https://www.thinktecture.com WASM, WASI, WTF? WebAssembly 101 - for .NET developers Christian Weyer Co-Founder & CTO @ Thinktecture AG 2

§ Intro § Web § Compute § .NET § Wrap-up WASM, WASI, WTF? WebAssembly 101 - for .NET developers Agenda 3

WASM, WASI, WTF? WebAssembly 101 - for .NET developers 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? WebAssembly 101 - for .NET developers What is WebAssembly? 5

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

WASM, WASI, WTF? WebAssembly 101 - for .NET developers 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? WebAssembly 101 - for .NET developers 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? WebAssembly 101 - for .NET developers 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? WebAssembly 101 - for .NET developers Major scenarios for WebAssembly in the browser 10

WASM, WASI, WTF? WebAssembly 101 - for .NET developers Migrating native code to the browser (large C++ codebase) 11

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

Offline Web-based Generative AI with LLMs, WebGPU & Wasm WASM, WASI, WTF? WebAssembly 101 - for .NET developers DEMO 13

WASM, WASI, WTF? WebAssembly 101 - for .NET developers 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? WebAssembly 101 - for .NET developers 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? WebAssembly 101 - for .NET developers 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? WebAssembly 101 - for .NET developers 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? WebAssembly 101 - for .NET developers Serverless WebAssembly with WASI 18

Serverless HTTP API with Spin & WASI WASM, WASI, WTF? WebAssembly 101 - for .NET developers DEMO 19

§ Addresses lack of module composition § Interface types, canonical ABI (application binary interface), component linking mechanism § Package & reuse code without duplication & static linking § Enables inter-component & inter-module communication WASM, WASI, WTF? WebAssembly 101 - for .NET developers Next Step: WebAssembly Component Model 20 https://raw.githubusercontent.com/WebAssembly/component-model/main/design/mvp/examples/images/shared-everything-dynamic-linking.svg

WASM, WASI, WTF? WebAssembly 101 - for .NET developers .NET 21

§ .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? WebAssembly 101 - for .NET developers .NET in 2023 22

§ .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? WebAssembly 101 - for .NET developers .NET & WebAssembly - browser 23

Blazor WebAssembly - File – New – Project… WASM, WASI, WTF? WebAssembly 101 - for .NET developers DEMO 24

§ .NET team sees need for first-class citizen support for Wasm & WASI § .NET WASI SDK (experimental) § Relies on LLVM § Produces one single .wasm file § .NET 8 WASI workload § Still not feature complete in RC1 § .NET NativeAOT-LLVM (very experimental today) § NativeAOT can make .NET binaries smaller & faster § Future Wasm support could be based on NativeAOT, in addition to Mono WASM, WASI, WTF? WebAssembly 101 - for .NET developers .NET & WebAssembly – beyond the browser 25

WASI with .NET § Hello Console app § ASP.NET Core app WASM, WASI, WTF? WebAssembly 101 - for .NET developers DEMO 26 § Spin with .NET § [Something crazy]

WASM, WASI, WTF? WebAssembly 101 - for .NET developers Wrap-Up 27

§ 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? WebAssembly 101 - for .NET developers Wasm & WASI will be big for ubiquitous computing 🙌 28 Server Future Web Cloud Microcontroller Extensibility Bare metal Edge

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 support tracking § https://github.com/dotnet/runtime/issues/65895 § .NET WASI SDK § https://github.com/dotnet/dotnet-wasi-sdk § Wasmtime .NET § https://github.com/bytecodealliance/wasmtime-dotnet § Specifications, Standards § https://github.com/WebAssembly/proposals § https://webassembly.org/roadmap/ § https://github.com/WebAssembly/WASI/blob/main/Proposals.md WASM, WASI, WTF? WebAssembly 101 - for .NET developers Links 30