1. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
.NET Web App
con WebAssembly
Nicolò Carandini
n.carandini@outlook.com
@TPCWare
2. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
Un’alternativa a
JavaScript
Prima di HTML5 ci sono stati molti
tentativi di creare degli strumenti
che si imponessero come standard di
fatto per creare applicazioni Web,
tutti falliti perché ogni azienda aveva
la sua specifica proposta,
incompatibile con le altre.
Microsoft già dal 1999 parlava di
Rich Client App, ma fu Macromedia
nel 2002 a coniare il termine
RIA – Rich Internet Application.
3. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
La guerra ai plugin
Uno dei difetti più noti dei vari metodi
per la realizzazione delle RIA consisteva
nella necessità di utilizzare i famigerati
plugin, che determinavano problemi di:
• Compatibilità coi diversi web browser
• Consumo risorse
• Introduzione bug
• Falle di sicurezza (soprattutto con Adobe Flash)
L’uso di plugin per l’esecuzione di framework esterni
termina nel 2014 con l’avvento di HTML5.
www.google.com/googlebooks/chrome
4. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
WebAssembly
alla riscossa
E’ uno standard W3C sviluppato
con il contributo di Mozilla, Apple
e Microsoft.
Consente l’uso di linguaggi diversi
da Javascript per generare codice
compatto, portabile ed
estremamente veloce.
E’ molto recente, visto che la prima
versione è di marzo 2017, ma è già
supportato da tutti i maggiori
browser.
5. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
Formato WASM
WASM è il formato
binario di WebAssembly,
che contiene codice di
basso livello (molto vicino
al linguaggio macchina)
che può essere parsato,
compilato ed eseguito in
modo estremamente
veloce in tutti i web
browser che lo
supportano.
S-Expression assembly bytecode
6. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
WASM toolchain
Vi sono diversi strumenti
per la scrittura e
compilazione di codice
WASM, anche online,
tutti basati sulla LLVM
toolchain e il suo
linguaggio intermedio IR.
ToolchainWebBrowser
LLVM
Optimizer
x86
WASM
LLVR IR LLVM
x86 Backend
LLVM
Wasm Backend
Clang
Frontend
Rust Rustc
Frontend
C / C++
HTML
WASM
JavaScript
JS VM
DOM
7. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
Demo WebAssembly
Da C a WAT / WASM
link
da S-EXPR a WASM
link
Uso di WASM e JavaScript
in una pagina HTML
8. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
.NET
per le Web App
Il team di Xamarin ha
sviluppato una versione di
Mono compilata in
WASM.
In questo modo è
possibile eseguire codice
.NET nei Web browser
che supportano
WebAssembly.
Mono runtime | C Library
LLVM bitcode
C# assemblies
clang
-target=wasm32
mono
-aot=llvmonly
Index.wasm
Index.js browser
mono – wasm
(bitcode -> wasm)
mono.wasm
load, compile
+ rum main()
load
metadata
(runtime)
libc
syscalls
9. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
Browser + Razor = Blazor!
Utilizza tecnologie web standard
come HTML e CSS, ma con C# e la
sintassi Razor al posto di JavaScript
per creare una Web UI basata su
componenti riutilizzabili.
Creato da Steven Sanderson
autore di Knockout, uno dei primi
framework JavaScript per realizzare
applicazioni SPA, da febbraio 2018 è
stato inserito (come esperimento) in
ASP.NET.
10. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
Web UI basata su
componenti
Un componente rappresenta
un elemento della UI, come una
pagina, un dialog, un tabset, o un
data entry form.
In Blazor, un componente è una
classe .NET, che può essere scritta a
mano (un file .cs) o più comunemente
tramite una pagina di markup Razor
(un file .cshtml).
I componenti possono essere
nidificati, riutilizzati e condivisi tra
progetti.
11. Licenza Creative Commons
Attribuzione - Non commerciale - Non opere derivate 3.0 Unported
BlazorComponent class
La UI del componente è definita
tramite HTML.
La logica di rendering dinamico viene
aggiunta con la sintassi C# di Razor.
Quando un’applicazione Blazor viene
compilata, il tutto viene convertito in
una classe C# di tipo BlazorComponent.
Il nome della classe generata
corrisponde al nome del file .cshtml.
