Moderne Anwendungen: Die WebAssembly & Serverless Revolutionen (?) - in Action

Die Landschaft für moderne Softwareentwicklung verändert sich. Es gibt heute und künftig neue Wege, um echte plattformübergreifende, native-ähnliche webbasierte Client-Anwendungen zusammen mit schlanken Cloud-Architekturen zu erstellen. In dieser Session wird Christian Weyer diese Möglichkeiten beleuchten und einen pragmatischen Überblick auf die Techniken und Technologien geben, die die Zukunft Ihrer Anwendungen beeinflussen können. Kommen und sehen Sie das Potenzial von WebAssembly im Browser und Serverless Computing in Azure - in Action!

Transcript

1. Moderne Anwendungen: Die WebAssembly & Serverless Revolutionen (?) - in Action Christian Weyer @christianweyer CTO Lohr am Main, Sep. 12, 2018
2. 2 § Founder & CTO at Thinktecture AG § Personal focus on § Mobile & web-based application architectures § Interoperability, cross-device § Pragmatic end-to-end solutions § Cloud-native & serverless architectures § Independent Microsoft Regional Director § Microsoft MVP for ASP.NET (Architecture) ASPInsider, AzureInsider § Google GDE for Web Technologies § christian.weyer@thinktecture.com § ! @christianweyer Christian Weyer Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
3. 3 Modern applications? Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
4. 4 Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Typical End-to-End Target Architecture HTTP API WS API HTTPS HTTPS WebSocket Service A Service B Service C HTTP API
5. 5 Cross-platform clients Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
6. 6 No app stores Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
7. 7 Powerful platform & technologies Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
8. 8 Data & business logic - available, scaleable, easy deployable Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
9. 9 No servers Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
10. 10 Low-entry platform Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
11. 11 … so, how??? Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
12. 12 A different approach for Microservices Serverless Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
13. 13 § We can choose from a continuum § VM ➔ § Containers ➔ § Orchestrators ➔ § PaaS ➔ § Serverless Moderne Anwendungen Evolution to Cloud Compute Continuum PaaS IaaS On-Premises Serverless Die WebAssembly & Serverless Revolutionen
14. 14 What is Serverless, anyway? Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
15. 15 § Serverless Compute → Azure Functions § Serverless Database → Azure Cosmos DB § Serverless Realtime → Azure SignalR Service § Serverless Events → Azure Event Grid § Serverless Messaging → Azure Service Bus § Serverless Workflows → Azure Logic Apps Azure Durable Functions § Serverless IoT → Azure IoT Hub § Serverless Analytics → Azure Application Insights § Serverless Containers → Azure Container Instances Moderne Anwendungen Serverless in Azure Die WebAssembly & Serverless Revolutionen
16. 16 Azure Functions Serverless Compute Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
17. 17 § Azure Functions is code being triggered by an event § Basic principles enable powerful use cases § Triggers § Bindings § Two ways of operation § Cost-optimized, automatic scale (aka Consumption Plan) § Always-on, via Azure App Service § V2 Runtime built on .NET Core § Available for self-hosting Moderne Anwendungen Azure Functions: Functions-as-a-Service Die WebAssembly & Serverless Revolutionen
18. 18 § In portal, via CLI, or in IDE § Local tooling & runtime available § Debugging locally or remote § Multiple language bindings supported § C# & C# Script (CSX) § F# § JavaScript, TypeScript (node.js) § Java (preview) Moderne Anwendungen Developing Functions Die WebAssembly & Serverless Revolutionen
19. 19 § Incoming event triggers function § Input bindings enable easy access to data from various data sources § Output bindings offer easy access to outbound data sinks Moderne Anwendungen Triggers & Bindings Die WebAssembly & Serverless Revolutionen Your code logic Runtime Azure Function HTTP Trigger Storage Input Binding Push Notification Output Binding Database Output Binding Email Output Binding
20. 20 Azure Cosmos DB Serverless Database Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
21. 21 § Globally distributed, elastically scalable § Fully managed by Azure § But not yet fully automatically scaling § Multi-model database § Key-value, document, graph ➔ NoSQL § Multiple APIs § DocumentDB, with SQL & JS APIs § MongoDB API § Cassandra API § Table Storage API § Graph Database with Gremlin API Moderne Anwendungen Cosmos DB: A Database with Many Faces Die WebAssembly & Serverless Revolutionen
22. 22 § Building event-driven architectures with Cosmos DB § Listening to Azure Cosmos DB collection for any changes § Inserts, updates, soft-deletes § Subscribe to collection changes § Can be used as a trigger for Functions Moderne Anwendungen Cosmos DB Change Feed Die WebAssembly & Serverless Revolutionen
23. 23 Azure SignalR Service Serverless Realtime Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
24. 24 § Realtime is a wanted feature nowadays § Dashboards and monitoring apps § Collaborative apps § Apps that require notifications § ASP.NET Core SignalR provides programming model for bi-directional ‘method invocation’ – via WebSockets, SSE or Long Polling § Wanted: “SignalR messaging & scale-out”-as-a-Service ➔ Azure SignalR Service Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Azure SignalR Service
25. 25 Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Azure SignalR Service & Azure Functions
26. 26 State of the art Modern Clients Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
27. 27 § Single Page Applications (SPAs) are the new smart clients Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Modern Applications & the Web
28. 28 § Some want web applications should that… § Feel & behave like a native app § Are installable, without (classic) app stores § Are able to work completely offline, without any server connections § Receive push notifications, without running § Offer in-app payment options § PWAs are targeted at both, mobile and desktop § Progressive Web Apps are not a technology § Collection of characteristics an application must/should support ➔ “Uber Pattern” § Various technologies are available to progressively enhance an application § Some outstanding standards like Web App Manifest, Service Workers Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Progressive Web Apps (PWA) – the Web gets more native
29. 29 Your native code in the browser WebAssembly Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
30. 30 § Low-level bytecode for the Web (beyond asm.js) § Bring any language into the browser § Currently targeted at C/C++ (and Rust) § Achieve superior performance in certain cases § Does not replace JavaScript § Goals § Fast, efficient, portable § Readable and debuggable § Use existing sandboxing tools § Don’t break the web Die WebAssembly & Serverless Revolutionen Moderne Anwendungen WebAssembly (WASM) https://twitter.com/getify/status/997098808344547328
31. 31 Die WebAssembly & Serverless Revolutionen Moderne Anwendungen WASM & JS Architecture (simplified) Compiler Parser JIT Web APIs (DOM, IndexedDb, File Storage etc.) Browser JavaScript (.js) HTML (.html) Inline JS JS Runtime WebAssembly (.wasm)
32. 32 Die WebAssembly & Serverless Revolutionen Moderne Anwendungen https://caniuse.com/#search=WebAssembly
33. 33 Die WebAssembly & Serverless Revolutionen Moderne Anwendungen WASM – A Simple Sample § Binary (.wasm) & text (.wat) format
34. 34 § Baremetal: WebAssembly Studio § Playing around with WASM in the browser § C/C++ tools & compilers § Binaryen: compiler and toolchain infrastructure library for WebAssembly, written in C++ § LLVM: The modern C/C++ compiler toolchain § Emscripten: LLVM-to-JavaScript-or-WASM compiler § Tools cross-compiling from major languages § Cheerp (from C++) § TeaVM (from Java) § Rust § mono-wasm (from C#) Die WebAssembly & Serverless Revolutionen Moderne Anwendungen WASM Tooling C / C++ Source code .wasm module HTML doc JS glue code Emscripten +
35. 35 § Mono is Microsoft’s strategy for cross-platform client applications § Xamarin is based on Mono, Unity as well § Support for .NET Standard § Mono team is working on tooling to compile .NET code to WASM § Aka ‘mono-wasm’ § JIT – for fast development cycles, including live reload § AOT – for optimized runtime deployment & execution Die WebAssembly & Serverless Revolutionen Moderne Anwendungen .NET & WASM – Work in Progress C# WebAssembly LLVM bitcode mcs IL Mono AOT compiler LLVM WASM backend
36. 36 An experiment based on WASM ASP.NET Core Blazor Moderne Anwendungen Die WebAssembly & Serverless Revolutionen
37. 37 § Blazor is an experimental Single Page Application (SPA) framework based on .NET § Not production-ready at all § Blazor projects run 100% in the browser * § On top of a WASM build of the Mono .NET runtime * § Compiled .NET assemblies are loaded into the browser * § Uses Razor / .cshtml templates for rendering HTML / CSS at compile time § Uses C# for writing application logic Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Blazor – WASM in Experimental Action * as of Sep 12, 2018
38. 38 Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Blazor Architecture* Compiler Parser JIT Web APIs (DOM, IndexedDb, File Storage etc.) Browser blazor.js Blazor page (.html) JS Runtime mono.wasm mono.js mscorlib.dll etc. myapp.dll * as of Sep 12, 2018
39. 39 § WebAssembly and Serverless can pave the way for modern software development § Serverless is a viable approach to create lightweight microservices § Azure Functions, Cosmos DB & Co. are an evolving set of technologies to create serverless architectures, not just for .NET developers § WebAssembly is still early, but enables powerful scenarios to spice up SPAs, beyond JavaScript § WASM paired with Progressive Web Apps features make the Web and your apps more native Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Summary
40. Moderne Anwendungen: Die WebAssembly & Serverless Revolutionen (?) - in Action Christian Weyer @christianweyer CTO Thank you! https://github.com/thinktecture/yad-msp-2018-serverless-wasm
41. 41 § Azure Functions Dependency Injection (with AutoFac) § https://github.com/introtocomputerscience/azure-function-autofac- dependency-injection § Processing 100,000 Events Per Second on Azure Functions § https://blogs.msdn.microsoft.com/appserviceteam/2017/09/19/processing- 100000-events-per-second-on-azure-functions/ § Azure Functions – Significant Improvements in HTTP Trigger Scaling § https://www.azurefromthetrenches.com/azure-functions-significant- improvements-in-http-trigger-scaling/ § Azure Functions: Cold Starts in Numbers § https://mikhail.io/2018/04/azure-functions-cold-starts-in-numbers/ Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Resources
42. 42 § WebAssembly Specification § http://webassembly.github.io/spec/core/index.html § LVVM § https://llvm.org/ § Emscripten § http://kripken.github.io/emscripten-site/ § Mono & WebAssembly § http://www.mono-project.com/news/2018/01/16/mono-static-webassembly- compilation/ § ASP.NET Blazor § https://blazor.net/index.html Die WebAssembly & Serverless Revolutionen Moderne Anwendungen Resources